Ashok Ashok - 4 months ago 25
Less Question

How to organize one base less file and multiple child less files?

Base less file is big and has variables, colors styles, mixins etc.,

Child less files (more then 30 files) has style codes which depends on base less file for variables and mixins.

Base css file is included in HTML. Only some child css files are included based on the users need.

The problem is, without importing base less file in child less file, it can't use variables and mixins in base file.

But if I import base file inside child, the child file become big.

What can I do? Please help me

Answer

To keep from outputting LESS files in another file but allow variable/mixin usage, you will want to import the original as a reference

@import (reference) "base";

"base" is the base.less file, extension optional.

So, in your case, with 30 different child .less files, just import base.less as a reference at the top of each.