Question

我对将bootstrap集成到angular中比较陌生，我首先运行 npm i --save bootstrap@3命令将所需文件下载到我的角度项目的node_modules文件夹中。

但是，当我进入angular.json文件以将相对路径输入“样式”部分时，出现以下错误：

 "styles": [
              "src/node_modules/boostrap/dist/css"
            ],

多个./src/node_modules/boostrap/dist/css中的错误找不到模块：错误：无法解决
中的'C：\ Users \ User \ Desktop \ ShoppingOnline \ client \ yoavonlineshop'中的'C：\ Users \ User \ Desktop \ ShoppingOnline \ client \ yoavonlineshop \ src \ node_modules \ boostrap \ dist \ css

我确保使用反斜杠。角度节点模块文件夹位于src文件夹之外。我需要上一层吗？ ../？输出路径为：

"outputPath": "dist/YoavOnlineShop",

edit：谢谢大家，它现在不会产生错误。但是，没有应用引导程序的样式。我是否需要在app.module或特定组件中添加任何内容？

在像上面那样集成引导程序之前，我使用了CDN，它工作正常，但现在我认为我已经破解了。

Answer 1

像这样改变路径

 "styles": [
                  "src/styles.css",
                  "node_modules/bootstrap/dist/css/bootstrap.min.css",
                  "node_modules/font-awesome/css/font-awesome.css",
                  "node_modules/toastr/build/toastr.min.css"
                ],

为什么node_modules / bootstrap不是src / node_modules / bootstrap，因为来自当前angular.json文件的角度路径是nodue_models，因此CLI会注意这一点。并且请记住，cli不会明确地注意dist路径的形成和最小化。

Answer 2

尝试一下：

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

它在src文件夹外部，但在angular项目内部，因此您可以如上所述访问它。

如果要在本地加载特定版本以及如何使用它，请检查this guy here。

如何将Bootstrap集成到有角度的CLI项目中

2 个答案: