1

I want to do the variable overriding thing in LESS (solution) but I need to import a resource by reference and it does not work.

file one.less:

@color: #ffffff;
.foo { color: @color; }

file two.less:

// file two.less
.bar {
  @import (reference) 'one.less';
}
@color: #000000;

The output:

.bar .foo {
  color: #ffffff // <-- expected: "color: #000000"
}

I could not find anything about that in the internet.

Is it a bug (working with version 1.7.5)? Is it a leak in my head? Or is it simply not supported?

Community
  • 1
  • 1
user470370
  • 572
  • 1
  • 5
  • 17
  • 1
    If I am correct there is a scope problem, the import happens within `.bar` and so the `color` from the imported file takes precedence over the `color` defined outside `.bar` in global scope. Have you tried declaring the `color` after the `import`? – Harry Mar 10 '15 at 07:50
  • Thank you - idiot me. That's it for the example. But that does not help me for my real-life code, because I have a lot of nested @import (reference) ("one.less" has an import to another file that has another import to another file etc.) and I do want to set all variables of all files in the root-less file. – user470370 Mar 10 '15 at 08:51
  • The only solution I found was to reimport things and override it then. – user470370 Mar 10 '15 at 09:26
  • 2
    I am not aware of your exact use-case, but can you not create a separate file just for the variables alone and import it in global scope? – Harry Mar 10 '15 at 12:49

0 Answers0