防止Angular CLI编译更少的文件

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

文件：site.less

@primary-color: 'red'

文件：foobar.component.less

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

这对于初始页面加载来说效果很好，背景颜色为红色。但现在我想要一个下拉式颜色选择器，具有多个颜色选项。当用户选择绿色而不是红色时，我想使用less函数，这不会导致任何更改。这是因为angular cli将less预编译为css，因此浏览器从不会看到开头的less文件

因此，我认为如果Angular不将较少的文件编译成css，那么当调用modifyVars时，浏览器将接收到更改

---

如何告诉Angular不要将less编译成css？

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

可以使用Angular cli的命令。这将弹出一个webpack配置文件，该文件将使您完全控制build命令的生成方式

---

旁注：我不认为不可能恢复

ng弹出

，但我已经了解到这并不总是一个简单的过程。特别是当angular cli团队向构建命令添加/修改功能时，多个版本已经通过。

cli在进入浏览器之前在服务器上编译less。它直接在css中用十六进制值替换变量的所有实例，这是提供给浏览器的内容。从浏览器的角度来看，在文件中从来没有一个变量可以重命名您的站点。less与Angular？的连接方式。Angular-cli.json中有一个用于“样式”的配置数组，我在其中包含了less文件。无组件文件是在编译过程中从我能告诉你的内容中提取出来的，关于如何将该文件添加到index.html文件并从angular cli.json中删除它？我试过了。它允许我修改site.less文件中的变量，但foobar.component.less文件中的任何内容都保持静态。我需要angular cli忽略所有较少的文件，并将其作为ISU提供。您可能需要使用cli命令并将webpack配置为不编译较少的文件。我对该命令不太熟悉，这是否意味着我不再使用angular cli进行构建，而是使用本机webpack？正确，它让你完全控制建筑，我会试试看是否能让它工作。同时，您能否将此作为问题的解决方案提交？如果我让它工作起来，我会将它标记为公认的解决方案。我决定采取一种完全不同的方法，因为我看到多个源代码（包括更少的源代码本身）提到不要在浏览器中编译。但就这个问题而言，这是正确的答案。@heilch是的，我肯定会推荐一种不同的方法。这会影响构建过程。