Angular 附加 bootstrap css 文件时出现 5 构建错误

Question

我已经创建了 angular 5 应用程序，安装了 ng-bootstrap 并尝试从 node_modules 附加 bootstrap css 文件：../node_modules/bootstrap/dist/css/bootstrap.min.css。当我运行 ng build 命令时，我得到 followinf 错误：

ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./node_modules/bootstrap/scss/bootstrap.scss
Module build failed: BrowserslistError: Unknown browser major
at error (/Users/***/dev/***/node_modules/browserslist/index.js:37:11)
at Function.browserslist.checkName (/Users/***/dev/***/node_modules/browserslist/index.js:320:18)
at Function.select (/Users/***/dev/***/node_modules/browserslist/index.js:438:37)
at /Users/***/dev/***/node_modules/browserslist/index.js:207:41
at Array.forEach (<anonymous>)
at browserslist (/Users/***/dev/***/node_modules/browserslist/index.js:196:13)
at Browsers.parse (/Users/***/dev/***/node_modules/autoprefixer/lib/browsers.js:44:14)
at new Browsers (/Users/***/dev/***/node_modules/autoprefixer/lib/browsers.js:39:28)
at loadPrefixes (/Users/***/dev/***/node_modules/autoprefixer/lib/autoprefixer.js:56:18)
at plugin (/Users/***/dev/***/node_modules/autoprefixer/lib/autoprefixer.js:62:18)
at LazyResult.run (/Users/***/dev/***/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:277:20)
at LazyResult.asyncTick (/Users/***/dev/***/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:192:32)
at LazyResult.asyncTick (/Users/***/dev/***/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:204:22)
at LazyResult.asyncTick (/Users/***/dev/***/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:204:22)
at processing.Promise.then._this2.processed (/Users/***/dev/***/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:231:20)
at new Promise (<anonymous>)
@ ./node_modules/bootstrap/scss/bootstrap.scss 4:14-164
@ multi ./node_modules/bootstrap/scss/bootstrap.scss ./src/styles.css

node version: 8.9.1

typescript version: 2.6.0

npm version: 5.5.1

angular version: 5.2.0

bootstrap version: ^4.0.0

ng-bootstrap version: "^1.0.0-beta.8

有什么想法吗？

Answer 1

如果您将 Angular CLI 与 Bootstrap 一起使用，您需要确保拥有这些版本：

@angular/cli : 1.7.0
Bootstrap : 4.0.0

这些是 Bootstrap 4.0.0 发布时的重大更改，Angular CLI 团队在发布 1.7.0 时解决了这个问题。

Angular 附加 bootstrap css 文件时出现 5 构建错误

Angular 5 build error when attaching bootstrap css file

css

twitter-bootstrap

ng-bootstrap

angular