Conditional import of LESS files

help
1

I have two files with less variables: nice.less and ugly.less. These files mainly contain LESS variables I use in my app. What is the easiest way to include one of them and not to include another?

The only option I see now is to solve it on CSS level:

button {
  &.nice { 
    background-color: red;
  }

  &.ugly { 
    background-color: blue;
  }
}

Instead I just want to write my LESS as follows and init @button_color variable with different values in nice.less and ugly.less and include only one of these files depending on settings file:

button {
  background-color: @button_color;
}
2

I solved it.

  1. I created packages folder in my meteor app and copied the following package there: https://github.com/meteor/meteor/tree/master/packages/less. This is standard meteor package responsible for building less files.

  2. Then I gave it a new name, added necessary chages to it’s logic and installed it using meteor add mvcdev:custom-less command to my app.

Here are the docs: https://docs.meteor.com/api/packagejs.html
Here is a good tutorial: https://themeteorchef.com/tutorials/writing-a-package

The only thing I find not oblivious is that it can be done locally and you don’t need to publish the package to npm or atmospherejs.