Lazy variables of css custom properties with less functions (even if it's overwritten) will break building
Open
@iChenLei is already working on this.
Since Jul 21, 2021.
bug
medium priority
- Dominant language
- JavaScript
- Stars
- 17k
- Forks
- 3.4k
- Avg merge
- 7h 42m
- Merged PRs (30d)
- 26
Description
To simplify the issue, let's assume a third-party-library which contains:
// `library/style.less`
@base-color: green;
@dark-color: darken(@base-color, 50%);
.some-class {
color: @base-color;
backgroundColor: @dark-color;
}
And my app would like to override the colors to css custom properties:
// app.less
import "~library/style.less";
@base-color: var(--primary-color);
@dark-color: var(--bg-color);
:root {
--primary-color: #fff;
--bg-color: #000;
}
html[data-theme="dark"] {
--primary-color: #000;
--bg-color: #fff;
}
In which I want to override both the @base-color and @dark-color less variables. However, the less will fail with LessError: error evaluating function `darken`: Argument cannot be evaluated to a color, even if the @dark-color in library is actually overridden in my app, and no darken() function should be called.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.