CODEWITHSUNDEEP
lessdotless
Curtis
Curtis

Reputation: 103348

How to import LESS file, but not render it?

I have a .less file where I keep all my global variables. For example:

lib.less

@primary-color: red;

.primary-font{
  font-family:Arial;
}

On one of my pages I have a page-specific CSS file. For example:

Homepage.less @import "lib.less";

.Login
{
   color:@primary-color;
   .primary-font;
}

I preprocess LESS using dotless. This renders "Homepage.less" to the client as:

.primary-font{
  font-family:Arial;
}

.Login
{
   color:red;
   font-family:Arial;
}

I don't want .primary-font to be rendered as I'm only using this as a style collection for importing into other classes. The output I really want is:

.Login
{
   color:red;
   font-family:Arial;
}

Is there any way of importing styles from another .less file for use in other classes, without them being rendered to the client?

Upvotes: 0

Views: 236

Answers (1)

Chris Pratt
Chris Pratt

Reputation: 239290

This has nothing to do with MVC, this is something you have to do in the LESS itself. See: http://lesscss.org/features/#mixins-feature-not-outputting-the-mixin

Essentially, if you don't want the mixin output as a class, you just need to suffix it with parenthesis:

.primary-font() {
    font-family: Arial;
}

Upvotes: 2

Related Questions