less / less/less.js

Import statement as part of passed in ruleset of a mixin fails

Open
#2,531 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug low priority
Dominant language
JavaScript
Stars
17k
Forks
3.4k
Avg merge
7h 42m
Merged PRs (30d)
26

Description

When using mixin like so and passing in an import statement I get some unexpected results.

The import statement inside the passed in declarations throws an error when passed in like so:

.mx({ @import "test2.less"; });

The error message is:

SyntaxError: Cannot read property 'rules' of undefined in ...

However, and I noticed this by chance, adding a colon after the @import will not throw an error, but will not output the imported file contents either:

.mx({ @import: "test2.less"; });

Version: 2.4.0
Testcase: https://gist.github.com/kontur/48fc207097fbfebbfea5
Expected behaviour: @import statement inside the passed in ruleset works. @import statement with consecutive colon fails and throws syntax error.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Use the linked gist and the two mixin examples to reproduce the failure on Less 2.4.0. Trace the ruleset import handling in the parser or evaluator, then verify that an import inside passed declarations produces the imported contents and that the colon variant no longer fails with the reported syntax error.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, javascript
Domain
compilers, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.