没看到这个:

@import 'bootstrap/scss/bootstrap.scss';

我只是在style。scss中添加了这一行 在我的情况下，我也想覆盖引导变量。

Angular-cli现在有一个专门的wiki页面，在那里你可以找到你需要的一切。TLDR，通过npm安装bootstrap，并添加样式链接到你的。angular-cli中的“styles”部分。json文件

你有很多方法可以在你的Angular项目中添加Bootstrap 4:

在你的Angular项目的index.html文件中包含引导CSS和JavaScript文件， 用@import关键字导入Angular项目的全局styles.css文件中的Bootstrap CSS文件。 在angular的styles和scripts数组中添加Bootstrap CSS和JavaScript文件。项目的Json文件

只需在index.html的Head标签中添加这三行

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

2个简单步骤

安装引导程序(正在安装最新版本)

npm install bootstrap@next

导入到你的项目中，在你的styles.scss中添加下面这行

@import '~bootstrap';

请注意您的导入顺序可能会有影响，如果您有其他库使用bootstrap，请将此import语句放在顶部

最后。：）

注:以下是我的版本

Angular: 9

节点:v10.16.0

NPM: 6.9.1

重要更新:ng2-bootstrap现在被ngx-bootstrap取代

ngx-bootstrap同时支持Angular 3和Angular 4。

更新:1.0.0-beta。11-webpack或以上版本

首先，在终端中使用以下命令检查你的angular-cli版本:

ng -v

如果你的angular-cli版本大于1.0.0-beta。11-webpack，那么你应该按照这些步骤:

安装ngx-bootstrap和bootstrap: NPM安装ngx-bootstrap——保存

这一行现在安装Bootstrap 3，但是将来可以安装Bootstrap 4。请记住，ngx-bootstrap支持这两个版本。

src / app / app.module开放。Ts和添加: import {AlertModule} from 'ngx-bootstrap'; .．. @NgModule ({ .．. import: [AlertModule.forRoot()，…), .．. }) angular-cli开放。Json(对于angar6及以后的文件名称更改为angular. Json。Json)，然后在styles数组中插入一个新条目: “风格”:( “styles”css, “. . / node_modules /引导/ dist / css / bootstrap.min.css” ), 打开src/app/ app.ponent .html，添加: <警报类型=“成功”> < /警报>你好

1.0.0-beta。10个或以下版本:

如果你的angular-cli版本是1.0.0-beta。10或以下，则可以使用以下步骤。

首先，进入项目目录并键入:

npm install ngx-bootstrap --save

然后，打开angular-cli-build.js并添加这一行:

vendorNpmFiles: [
   ...
   'ngx-bootstrap/**/*.js',
   ...
]

现在，打开src/system-config。然后写:

const map:any = {
   ...
   'ngx-bootstrap': 'vendor/ngx-bootstrap',
   ...
}

,:

const packages: any = {
  'ngx-bootstrap': {
    format: 'cjs',
    defaultExtension: 'js',
    main: 'ngx-bootstrap.js'
  }
};