使用 VS 2017 和 Angular 4 安装 Bootstrap 4

Question

我正在做我的第一个项目，尝试使用以下工具：

• .Net Core 2 MVC
• 角 4
• 引导程序 4
• Visual Studio 2017

我按照本教程毫无问题地运行了 Angular 应用程序： http://www.talkingdotnet.com/how-to-create-an-angular-4-app-with-visual-studio-2017/

总的来说，我对 Angular4、webpack 等非常陌生。我参与过许多淘汰赛、Angular 1 和 Angular 2 项目，但我自己从未设置过 Angular 2+ 项目。

我不知道如何使用 npm 安装 bootstrap 4。在最新的引导库上运行 npm install 很好，但我不知道如何将 CSS 和 js 注入应用程序。大多数关于 bootstrap 4 入门的指南都使用了上述教程中未生成的文件（例如，来自此的 styles.css：http://technobytz.com/install-bootstrap-4-using-npm.html）。

这是来自 Visual Studio 的当前项目视图：

有什么想法吗？提前致谢。

Answer 1

我也遇到了同样的问题，发现 this answer by @james-law 到一个类似的问题解决了这个问题。

1. 在 Visual Studio 中打开您的 Angular SPA 解决方案
2. 打开 package.json 并将引导条目更新为 "bootstrap": "4.0.0"，或您需要的任何版本
3. 在 Visual Studio 中关闭解决方案
4. 打开项目文件夹，删除node_modules文件夹
5. 打开项目文件夹的命令提示符
6. 在命令提示符下运行npm install popper.js --save
7. 在命令提示符下运行npm install
8. 在命令提示符下运行webpack --config webpack.config.vendor.js
9. 在 Visual Studio 中打开解决方案
10. 构建解决方案，之后您应该完全升级

虽然答案很有效，但我不想全局安装 webpack，所以我跳过了第 8 步，而是在第 10 步之前删除了wwwroot 中的dist 文件夹。