角度替换.使用docker compose的scs不影响

Question

我有一个用Angular 8编写的前端应用程序。我希望每个环境都有不同的颜色主题(test/acc/prod(。所以我创建了不同的variables.css文件，如下所示：

• variables.test.scss
• 变量.acc.scss
• 变量.prod.scss在Angular项目中的assets/scs文件夹中

我使用docker compose进行部署，并根据环境将variables.css文件替换为特定的文件。下面是我为测试环境编写的docker部分：

(...)
my-angular-application:
image: my.registry.pl/my-angular-application:${MY_ANGULAR_APPLICATION_IMAGE_TAG}
restart: always
ports:
- "4200:80"
volumes:
- ./env/variables.test.scss:/usr/share/nginx/html/assets/scss/variables.scss
networks:
- backtier
(...)

docker-compose up之后的variables.scss命令被成功替换(我进入一个容器并检查了它(，但在浏览器上打开应用程序后，应用程序具有默认variables.scss文件中的默认样式，而不是我复制的样式：/

为什么它没有按预期工作？

Answer 1

角度编译后，您似乎正在更改变量文件？如果是这样的话，它将永远不会工作，因为这些文件已经被处理了

然后你需要在角度编译之前运行一个脚本来替换你的文件

您可以通过创建一个脚本来完成文件替换，然后启动ng build，然后您可以在package.json中引用这个脚本；脚本"；值，以便您可以将其与npm 一起使用

---

编辑掉，因为这实际上是一个角度错误(https://github.com/angular/angular-cli/issues/11451)：

如果您对每个环境都有特定的构建配置，那么您可以使用angular.json来实现这一点您需要在angular.json中设置文件replace在该示例中，我将environment.ts替换为environment.ci.ts

"fileReplacements": [
{
"replace": "deploy/environments/environment.ts",
"with": "deploy/environments/environment.ci.ts"
}
],