Clever Geek Handbook

Smaller CSS import structure

I have a really large .less file that I am trying to split into smaller files for readability.

But the files I import rely on variables and mixins from the main.less file ... so they don't compile on their own.

Should I just include variables and mixins at the beginning of both files, or is there a better way to do this?

+3


source to share


2 answers


If variables and mixins are independent of other styles (as they probably should be), you can create separate files for variables and mixins ...

- less_directory
  |-- mixins.less
  |-- variables.less
  |-- style1.less
  `-- style2.less


.. and then just import

when needed.

+2


source


You don't need to include variables in every file if you've included them in your main.less

file.

/* main.less */
@import mixins.less
@import one.less
@import two.less


Assuming you only upload main.less

to your site when working with one

or two

, the variables from mixins

should work fine since everything will compile to main.less

.

+5


source






More articles:


All Articles