Duplication when using @import across multiple files

[ianstormtaylor]

I have a main.less which imports other less files. And those files all import utils.less that contains useful mixins that I need to use everywhere.

But when I do this, the mixins get duplicated in the compiled code. Once for each time utils.less was imported.

CSS that should be around 100k is 1mb instead, making LESS completely unusable.

Anyone else having this problem? and any plans on a fix?

Thanks @cloudhead

[chucknthem]

Yeah I do something similar, I ended up reordering css includes in my main.less file and not using any imports in any other file. Not ideal, but would be great to see this fixed!

[bgstaal]

+1 on this one. Dependency management becomes a mess when working on larger projects.

[canthony]

We'd be pleased to see this changed too; my IDE (IntelliJ IDEA) highlight errors in the LESS syntax, and so I like to explicitly include all dependencies in each module's .less file; the duplication means I've had to stop doing that.

[cloudhead]

Then why not import utils.less first, and only once, from main.less, then import all other files from there too?

[bgstaal]

As long as it is only one file I would say it is not a big issue. But when you build up a component based structure with one less file pr. component and some of them have more than one dependency it becomes increasingly hard to avoid duplicates while ensuring all dependencies are in place. IDE support is also an issue as @canthony mentioned. I guess there is a reason why most languages have import statements and that the compiler takes care of duplicates.

[cloudhead]

Alright, I'll add a check, it should be pretty straightforward.

[eager]

+1 from my team.

We’ve got several files of mixins and variables, and it’s easier for us (and IntelliJ IDEA) to manage dependencies if we @import the needed mixin file(s) in each dependent file. However, doing this causes our combined (un-minified) CSS to go from 119KB to 2.4MB.

[nathanziarek]

Another +1 from my team. Similar to @eager, we've got a file 60KB file currently bloated to 2.2MB with tons of duplicates.

[jeremyricketts]

What Sasha said below. This is actually my first experience with LESS and I was tearing my hair out trying to debug this. As a front end dev, I don't know enough Ruby to try and debug the parser though.

[sashasklar]

This issue has reared it's head in Twitter Bootstrap, which is no doubt going to be many developers' first exposure to LESS. It can be corrected by re-organizing how the files are included, but it seems like non-desired behavior so it should probably be fixed. To see it in action, compile Bootstrap's style.css and look for the "label, input, button, select, textarea" declaration.

[alindsay55661]

+1 of course.

[lukeapage]

There is now a import-once and a bug about the fact its test fails.. we should get that sorted out soon.

So I am closing this as a duplicate