Question

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

我使用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

Answer 1

尝试像这样导入引导程序

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

还检查文件结构

Answer 2

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

npm install bootstrap@latest --save

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

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

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

2 个答案: