仅限开发配置中的Angular 7样式表

Question

我有一个src/styles/debug.scss文件，仅为开发人员添加了一些辅助样式，但是这些样式不应在生产中显示。在开发模式下仅仅包含此样式表的最佳方法是什么？

我在angular.json内做了一些尝试，但还没有碰到运气。

在root > projects > {project-name} > architect > build > configurations级别，我认为我可以添加以下内容

"development": {
  "styles": [
    "src/styles/debug.scss"
  ]
}

但这似乎无济于事。这里有我想念的东西吗？

Answer 1

您已经到了一半（假设目标是与ng serve合作）。

您已经完成了定义的development配置，您可以选择将其包含在ng build命令中，以将调试样式包括在构建工件中。
您应该能够使用ng build --configuration=development运行此构建，并验证其行为是否符合预期。

下一步是为development命令定义ng serve配置，该配置将以development构建配置为目标。使用以下内容（代替您的{project-name}）更新root > projects > {project-name} > architect -> serve：

"development" {
  "browserTarget": "{project-name}:build:development"
}

现在，您应该可以运行ng serve --configuration=development并包含调试样式了。