css - Angular Cli 和 AOT 问题

Question

我在我的项目中使用 Angular CLI 1.4.1 并希望使用 AOT 编译来构建。但是我遇到了两个问题：

1）我有带有注册组件的 Shop 模块。在registration.component.css我添加了行

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

该文件存在于 node_modules/@angular/material/prebuilt-themes/ 文件夹中。但是，当我运行 AOT build 时，我收到错误消息：

Error: Compilation failed. Resource file not found: C:/library/src/app/shop/book-registration/~@angular/material/prebuilt-themes/indigo-pink.css
    at ModuleResolutionHostAdapter.readResource (C:\library\node_modules\@angular\compiler-cli\src\compiler_host.js:387:19)

2）我有全局文件styles.css，它包含在.angular-cli.json中：

  "styles": [
    "styles.css"
  ]

当我运行开发构建时，该文件中的样式在页面上可用。但是，在 AOT 构建之后，不会加载样式。

请指教。

Answer 1

从您的组件中删除导入

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

并将此主题的参考添加到 angular-cli.json 中：

"styles" : [
  "styles.css",
  "../node_modules/@angular/material/prebuilt-themes/indigo-pink.css"]

并尝试再次运行 ng serve