Angular 6 在 angular.json 中加载 css 文件夹

Question

我正在尝试将我的 html 模板转换为 Angular 应用程序。我有一个名为 plugins 和 img 文件夹的 css 文件夹。

当我添加时：

 "styles": [
          "src/assets/plugins/listtyicons/style.css",
          "src/assets/plugins/jquery-ui/jquery-ui.min.css",
          "src/assets/plugins/bootstrap/css/bootstrap.min.css",
          "src/assets/plugins/plugins/isotope/isotope.min.css",
          "src/styles.css"

        ]

angular.json 文件中的这段代码在尝试启动 Angular 应用程序时出现错误。我已将我的插件文件夹放在资产文件夹中。我收到此错误：

 ERROR in multi ./src/assets/plugins/listtyicons/style.css 
./src/assets/plugins/jquery-ui/jquery-ui.min.css ./src/assets/plugins/bootstrap/css/bootstrap.min.css ./src/assets/plugins/plugins/isotope/isotope.min.css ./src/styles.css
Module not found: Error: Can't resolve 
'/Users/nilay/angular/bes/src/assets/plugins/plugins/isotope/isotope.min.css' 
in '/Users/nilay/angular/bes'

我不知道为什么会出现这个错误。

Answer 1

在 angular 6 中，您必须在 src/style.css（而不是 angular.json）中添加 only：

@import "assets/plugins/listtyicons/style.css";
@import "assets/plugins/jquery-ui/jquery-ui.min.css";
@import "assets/plugins/bootstrap/css/bootstrap.min.css";
@import  "assets/plugins/plugins/isotope/isotope.min.css";

在angular.json

"styles": [
          "src/styles.css"
        ]