Search code examples
nestedargumentslessmixinsparse-error

Nested mixins in LESS throws an error


I'm trying to have a .flexbox mixin that accepts an argument @orient, which should automatically apply box-orient as well. When using it in combination with !important, I'm experiencing an error that is also reproducible with a more narrowed-down testcase:

.foo() {
  .bar;
}

.bar {
  color: red;
}

body {
  .foo() !important;
}

This makes LESS throw an error (I'm using it in node.js):

C:\...\node_modules\less\lib\less\parser.js:385
                        throw new(LessError)(e, env);
                              ^
TypeError: Cannot call method 'charAt' of undefined

Oddly enough, using .foo instead of .foo() works as expected:

.foo {
  .bar;
}

.bar {
  color: red;
}

body {
  .foo !important;
}

What am I doing wrong?


Solution

  • A quick search led me to this bugreport. It is a known issue.

    https://github.com/cloudhead/less.js/issues/740

    To be honest I would suggest you try to accomplish what you're trying to do some other way. The less.js backlog is at time of this writing 417 issues large. It isn't likely going to be fixed any time soon.

    (yes it is this bugreport, you created a nested rule by extending .foo with .bar)