无法将 Bootstrap 加载到 Angular CLI 项目中答案

【问题标题】：Unable to load Bootstrap into Angular CLI project无法将 Bootstrap 加载到 Angular CLI 项目中
【发布时间】：2017-11-15 09:45:23
【问题描述】：

我在将 Bootstrap 4 RC6 添加到我的 Angular CLI 项目时遇到问题，我不确定发生了什么 - 或者如何描述它。我创建项目的步骤如下：

我使用 Angular CLI 创建了一个新项目，其样式设置为 SASS，使用 ng new My_New_Project --style=sass.

我已经使用 npm install node-sass --save-dev. 安装了 node-sass

我已经使用 npm install bootstrap@4.0.0-alpha.6. 安装了 bootstrap 4 RC6

此时我将@import '~bootstrap' 添加到我现有的styles.scss 中，我收到了一个奇怪的错误，如下所示：

ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/styles.scss
Module build failed:
undefined
  ^
      Invalid CSS after "if": expected "{", was "(typeof jQuery === "
      in C:\<path>\node_modules\bootstrap\dist\js\bootstrap.js (line 7, column 4)
 @ ./src/styles.scss 4:14-189
 @ multi ./src/styles.scss

【问题讨论】：

标签： node.js angular sass angular-cli bootstrap-4

【解决方案1】：

尝试像这样导入引导程序

@import '~bootstrap/dist/css/bootstrap.css';

还要检查文件结构

【讨论】：

【解决方案2】：

首先，您需要将引导程序安装到您的项目中。您可以使用以下命令：

npm install bootstrap@latest --save

如果您已经安装好引导程序，请使用以下命令将其导入：

@import '~bootstrap/dist/css/bootstrap.min.css';

【讨论】：