CODEWITHSUNDEEP
cssangulartwitter-bootstrapng-bootstrap
Arkadi
Arkadi

Reputation: 1357

Angular 5 build error when attaching bootstrap css file

I have created angular 5 app, installed ng-bootstrap and trying to attach bootstrap css file from node_modules: ../node_modules/bootstrap/dist/css/bootstrap.min.css. when I run ng build command I get followinf error:

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

Any ideas?

Upvotes: 0

Views: 502

Answers (1)

Andrew Lobban
Andrew Lobban

Reputation: 2137

If you are using Angular CLI with Bootstrap, you need to ensure you have these versions:

  • @angular/cli : 1.7.0
  • Bootstrap : 4.0.0

These was a breaking change when Bootstrap 4.0.0 was released, Angular CLI team addressed it with the release of 1.7.0.

Upvotes: 2

Related Questions