防止Angular CLI编译较少的文件

Question

我正在尝试使用较少的变量将动态主题应用于我的网站。这是一个简化的场景：

档案：site.less

@primary-color: 'red'

档案：foobar.component.less

@import '../site.less';
.some-element {
    background-color: @primary-color;
}

这适用于初始页面加载，背景颜色为红色。但现在我想要一个带有多种颜色选项的下拉颜色选择器。当用户选择绿色而不是红色时，我想使用less函数less.modifyVars({'@primary-color', 'green'})，这不会导致任何变化。这是因为角度cli预先编译较少的css，因此浏览器永远不会看到较少的文件开头。

所以我在想，如果Angular没有将较少的文件编译成css，那么当调用modifyVars时，浏览器会接收更改。

如何告诉Angular不要少编译到css中？

Answer 1

您可以使用angular cli的ng eject命令。这将弹出一个webpack配置文件，它将使您可以完全控制构建命令的构建方式。

旁注：我认为不可能还原ng eject，但我读过它并不总是一个简单的过程。特别是当多个版本通过了角度cli团队添加/修改构建命令的功能时。

Answer 2

为什么不在less文件中更改变量名？