angular2-cli给出了@multi样式错误

Question

我最近开始使用angular2-cli并创建了一个新项目.我想在我的项目中使用bootstrap,因此我安装了bootstrap然后想要导入bootstrap css文件,就像它在angular2-cli指南中所示.https://github.com/angular/angular-cli#global-library-installation 运行ng服务后,我收到以下错误.

多样式中的错误找不到模块:错误:无法解析'/ home/krishna/angular2_migrate/webui/node_modules中的'/home/krishna/angular2_migrate/webui/node_modules/bootstrap/dist/css/bootstrap.min.css'/angular-cli/models'@多种风格

我究竟做错了什么 ？

有关angular2-cli版本的信息

krishna@Krishna:~/angular2_migrate/webui$ ng version
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
angular-cli: 1.0.0-beta.17
node: 4.4.3
os: linux x64

Answer 1

在路径前添加../

在angular-cli.json中,

"styles": [
  "../node_modules/bootstrap/dist/css/bootstrap.min.css",
  "styles.scss"
]

Answer 2

在Angular 7中，该文件称为“ angular.json”。

确保为“样式”选项设置了正确的扩展名。就我而言，我使用SCSS选项安装了Angular CLI，但默认情况下将扩展名设置为SASS。

       "styles": [
          "src/styles.scss" // default was: src/styles.sass
        ],

Answer 3

我正在使用Angular 6，所以我的文件名是angular.json，但是我能够通过删除它所要求的“ ../”路径来解决类似的问题。下面是我的安装程序，用于向我的angular应用程序添加bootstrap和jquery。

   "styles": [
          "src/styles.css",
          "node_modules/bootstrap/dist/css/bootstrap.css"
        ],
        "scripts": ["../node_modules/jquery/dist/jquery.js",
          "node_modules/bootstrap/dist/js/bootstrap.bundle.js"
      ]

注意：对于jQuery，我需要“ ../”，而bootstap则不需要。

根据我遇到的问题进行选择：

    "styles": [
          "src/styles.css", 
          "../node_modules/bootstrap/dist/css/bootstrap.css"
       ],
    "scripts": [
          "../node_modules/jquery/dist/jquery.js", 
          "../node_modules/bootstrap/dist/js/bootstrap.bundle.js"
      ]

此外，本文还提供了多个替代选项来设置它。

https://medium.com/@rogercodes1/intro-to-angular-and-how-to-setup-your-first-angular-app-b36c9c3ab6ca