Variable Name Error “is undefined” even though “variables.less” imported

Question

I started using LESS today. But it\'s kinda weird. This code does not work. I get an error:

! Variable Name Error: @linkColor in a is undefined.

Answer 1

This error can also occur via bad imports in the files you're importing.

I also encountered this issue, when using multiple layers of import, and the 'lessc' compiler from Node.js:

• The original file imported a file (which we will call 'child')
• The child file imported a file (which we will call 'grandchild')
• The grandchild was imported

I attempted to compile the original file, and received the same 'undefined variable' behavior. I could see the variable was defined in the child and the syntax lookedcorrect.

No prior errors were displayed.

The problem turned out that the child was not importing the grandchild properly. Ie,

@import grandchild.less

rather than:

@import "grandchild.less";

Fixing the child importing the grandchild made the original see the variables defined in the child.

This seems like a bug in less - ie, the bad import should show up in the 'lessc' output, so one day it will probably be fixed. Until then, I hope this helps.