Angular-cli: BrowserslistError: Unknown browser major at error

[marshallcool]

I just deleted the node_modules folder and put the packages back

macOs
Node 8
node: 8
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/compiler-cli": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/cli": "^1.5.0",
"@angular/compiler-cli": "^5.0.0",

Error:
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/bootstrap/dist/css/bootstrap.min.css Module build failed: BrowserslistError: Unknown browser major at error (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:37:11) at Function.browserslist.checkName (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:320:18) at Function.select (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:438:37) at /Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:207:41 at Array.forEach (native) at browserslist (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:196:13) at Browsers.parse (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/browsers.js:44:14) at new Browsers (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/browsers.js:39:28) at loadPrefixes (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/autoprefixer.js:56:18) at plugin (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/autoprefixer.js:62:18) at LazyResult.run (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:270:20) at LazyResult.asyncTick (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:185:32) at LazyResult.asyncTick (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:197:22) at LazyResult.asyncTick (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:197:22) at processing.Promise.then._this2.processed (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:224:20) at LazyResult.async (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:221:27) @ ./node_modules/bootstrap/dist/css/bootstrap.min.css 4:14-131 @ multi ./src/styles.scss ./src/select.css ./node_modules/bootstrap/dist/css/bootstrap.min.css ./node_modules/font-awesome/css/font-awesome.min.css ./node_modules/primeng/resources/primeng.min.css ./node_modules/primeng/resources/themes/omega/theme.css ./node_modules/material-design-icons/iconfont/material-icons.css

[dan655t]

Running into the same problem here.

[marshallcool]

Where ?

[bryan-pegg23]

bootstrap's 4.0.0 beta 3 came out today. Might have to downgrade to their beta 2 again to make it work. I am running into the same issue.

[DamianKedzior]

@bryan-pegg23 Thanks. Bootstrap was a problem in my case.

[RyanWillDev]

The issue seems to be caused by this section of bootstrap's package.json file

 "browserslist": [
    "last 1 major version",
    ">= 1%",
    "Chrome >= 45",
    "Firefox >= 38",
    "Edge >= 12",
    "Explorer >= 10",
    "iOS >= 9",
    "Safari >= 9",
    "Android >= 4.4",
    "Opera >= 30"
  ],

The autoprefixer plugin uses this list and unless you have a version 7.0 or higher it does not support the last n major version syntax.

Upgrading autoprefixer should fix the issue.

[ekwebster]

ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader?{"ident":"postcss"}!./node_modules/bootstrap/dist/css/bootstrap.min.css
Module build failed: BrowserslistError: Unknown browser major

Same error, just started happening.

Autoprefixer is at 6.7.7
Boostrap 4.0.0 beta.2

package.json

{
  "name": "apm",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve -o --port 3913",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint --type-check",
    "e2e": "ng e2e",
    "build-prod": "ng build --prod --aot"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^5.0.0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.8",
    "angular-dual-listbox": "^4.4.0",
    "bootstrap": "^4.0.0-beta.2",
    "core-js": "^2.4.1",
    "font-awesome": "^4.7.0",
    "jquery": "^1.9.1",
    "ng2-select": "^2.0.0",
    "ngx-progressbar": "^2.1.1",
    "ngx-toastr": "^6.5.0",
    "popper.js": "^1.12.3",
    "rxjs": "^5.4.1",
    "underscore": "^1.8.3",
    "zone.js": "^0.8.14"
  },
  "devDependencies": {
    "@angular/cli": "1.5.0",
    "@angular/compiler-cli": "^5.0.0",
    "@angular/language-service": "^5.0.0",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/jquery": "^3.2.15",
    "@types/node": "~6.0.60",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.0.4",
    "tslint": "~5.3.2",
    "typescript": "~2.4.2"
  }
}

package-lock.json

"autoprefixer": {
      "version": "6.7.7",
      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
      "dev": true
    },

```json
"bootstrap": {
"version": "4.0.0-beta.2",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.0.0-beta.2.tgz",
"integrity": "sha512-DzGtdTlKbrMoGMpz0LigKSqJ+MgtFKxA791PU/q062OlRG0HybNZcTLH7rpDAmLS66Y3esN9yzKHLLbqa5UR3w=="
},

```json
 "postcss-loader": {
      "version": "1.3.3",
      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
      "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
      "dev": true
    },

[arturovt]

@ekwebster "bootstrap": "^4.0.0-beta.2" the caret here means it will update you to the most recent version, just try yarn upgrade [email protected] or npm update [email protected]

[RyanWillDev]

@ekwebster It looks like the last n major versions syntax was added in browserList 2.4 and autoprefixer updated to version 2 of browserList in version 7.0.

So, any version of autoprefixer above 7.0 should work. I corrected my comment above.

[marcelolimabh]

I have the same error

[mythz]

Running into this issue as well trying to use the latest angular-cli "1.6.3" with the latest bootstrap "4.0.0-beta.2".

[oopsmails]

Did you tried this? Same error and fixed by,

• From "bootstrap": "^4.0.0-beta.2" to "bootstrap": "4.0.0-beta.2", take out "^"
• Then npm install
• Then ng serve

[ekwebster]

Removing the caret ‘^’ did solve the problem

[krischandra]

I have the same issue instead i am getting warning.

WARNING 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":fal
se,"precision":8,"includePaths":[]}!./src/style-sheets/theme/theme.scss
(Emitted value instead of an instance of Error) postcss-custom-properties: C:Userskrishna.chandraDesktopretailng-uisrcstyle-sheetsthemetheme.scss:456:5: variable '--globalSub2' is undefined and u
sed without a fallback
NonErrorEmittedError: (Emitted value instead of an instance of Error) postcss-custom-properties: C:Userskrishna.chandraDesktopretailng-uisrcstyle-sheetsthemetheme.scss:456:5: variable '--globalSu
b2' is undefined and used without a fallback
at Object.emitWarning (C:Userskrishna.chandraDesktopretailng-uinode_moduleswebpacklibNormalModule.js:117:16)
at result.warnings.forEach (C:Userskrishna.chandraDesktopretailng-uinode_modulespostcss-loaderlibindex.js:149:49)
at Array.forEach (native)
at postcss.process.then (C:Userskrishna.chandraDesktopretailng-uinode_modulespostcss-loaderlibindex.js:149:27)
@ ./src/style-sheets/theme/theme.scss 4:14-208
@ multi ./node_modules/bootstrap/dist/css/bootstrap.min.css ./node_modules/primeng/resources/themes/omega/theme.css ./node_modules/primeng/resources/primeng.min.css ./src/style-sheets/theme/theme.scss ./
node_modules/font-awesome/css/font-awesome.css
"4.0.0-beta.2" did not worked in my scenario.

[filipesilva]

This does seem to be related to [email protected], and is also causing failures in our CI (https://travis-ci.org/angular/angular-cli/jobs/322676874).

[ajinkya-vaze]

I was facing same issue.
I downgraded bootstrap with following steps.
Uninstall [email protected]:
_npm uninstall bootstrap --save_
Then installed [email protected]:
_npm install [email protected] --save_

I did not remove ^ because package-lock.json will handle it.

[robertmazzo]

same problem here - on two different laptops. Why is beta.3 still up on their site ?

[galcober-dtt]

I have fixed my package.json to:

"bootstrap": "4.0.0-beta.2"
If you have an app at production environment I think the best practice is to use a stable and fixed version.

Steps:

1-Remove /node_modules
2-Fix the package.json file
3-Execute npm install
4-Enjoy!

[GhanemJR0]

I downgraded bootstrap to "[email protected]" and the app back to work again

[UtsavPreet]

I'm also facing the same problem
ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/bootstrap/dist/css/bootstrap.min.css

@ ./~/bootstrap/dist/css/bootstrap.min.css 4:14-127
@ multi ./~/bootstrap/dist/css/bootstrap.min.css
webpack: Failed to compile.

[Laragh]

still happening - also today had to specify beta 2 as 3 will produce same error as above

[thejimgaudet]

A workaround here on SO (https://stackoverflow.com/questions/48034051/bootstrap-4-beta-3-throws-error-with-angular-cli). Will need to re-run each time you upgrade, until the next version of CLI that updates autoprefixer to latest...

[filipesilva]

This should be fixed on Angular CLIs side in the next release (1.6.4). That should be next week.

[thdavids07]

Thanks you, for the moment I copy manually the files of bootstrap beta 3 for beta 2 in my project "proynode_modulesbootstrapdistcss" and It could render normally Because I need use some styles that beta 2 do not has.

[Domer79]

I changed the path to bootstrap.scss @import "~ bootstrap / scss / bootstrap.scss"; in the styles.scss file. And solved this problem
Also adding packages node-sass and sass-loader

[beginor]

I have the same problem too.

[Meowzz95]

Same problem here and @Domer79 's solution does not work, the angular CLI shows the same error

[jameskentTX]

You can use Bootstrap 4 beta 3, but first edit package.json in node_modules/bootstrap:

"browserslist": [
"last 1 major version", <----- delete this line
">= 1%", <----- delete this line
"Chrome >= 45",
"Firefox >= 38",
"Edge >= 12",
"Explorer >= 10",
"iOS >= 9",
"Safari >= 9",
"Android >= 4.4",
"Opera >= 30"
],

[bmrana]

@jameskentTX provided me with the workaround. Except the filename is package.json in the node_modules/bootstrap folder for me.

[demoalbe]

Hi!
I upgraded to release 1.6.4, but i'm always facing the problem, using [email protected].
Unfortunately I need to use that version of bootstrap because it fixes another problem.
I'll try the workaround proposed some days ago, but I hope in a "cleaner" solution.
Thank you for the support.

[greuff]

CLI 1.6.4 does not fix the problem.

[PetrBainar]

CLI 1.6.4 fixed the problem for me.

[Taha-Di-Nero]

The error persist only in production builds.

[megafy]

Temp Fix

• change style.css file to style.scss
• change style.css reference in .angular-cli.json to style.scss
• in style.scss import
  @import '~bootstrap/scss/bootstrap.scss';

Should work

[ernitishkumar]

CLI 1.6.4 does not fix the issue !!
But after applying workaround by @jameskentTX its working. Since we wanted the beta 3 build of bootstrap in our project we have to use this workaround till Angular CLI fixes the issue.

[ibagaric]

You must combine @megafy and @jameskentTX solution

[filipesilva]

Can you try @angular/[email protected] instead please? See https://github.com/angular/angular-cli/issues/9029#issuecomment-357267439 for more details.

[Taha-Di-Nero]

@filipesilva Yes using @angular/[email protected] fix the issue.

[ismailbaig]

Even i am facing the same issue.

package.json
{
...
...

"ngx-bootstrap": "^1.9.3",
...
...
}

package-lock.json
{
...
"autoprefixer": "6.7.7",
...
}

not able to resolve it. Any help

[KostyaTretyak]

I have @angular/[email protected] but this problem has not disappeared. I noticed that problems arise inside src/styles.css and with @import '~any/lib/here.css';. That is, not depending on the library, if it is imported in this way. The main thing is that in the beginning there was a tilda.

/* This not works */
@import '~highlight.js/styles/default.css';
@import '~highlight.js/styles/googlecode.css';
@import '~font-awesome/css/font-awesome.min.css';
@import '~katex/dist/katex.min.css';

/* This works */
@import 'assets/css/angular.css';
@import 'assets/css/blog.css';

[RowSolAdmin]

Hit same issues defined above using cli 1.6.5 whilst trying to perform a production build.

Temp fix suggested by @jameskentTX above allowed production build to run.

[Jimeh87]

I upgraded to @angular/[email protected], created a new project, added bootstrap@^4.0.0 and I was able to start the app with bootstrap.min.css plumbed in by adding it as an @import to my styles.css. I was also able to start my app by plumbing it in via the .angular-cli.json by adding it to the styles.

A gotcha here would be to make sure you upgrade your global and your app to @angular/cli to 1.7.0-beta.1 and double check that it actually upgraded by running ng --version (mine didn't so I had to manually remove and reinstall it for some reason).

[pranaysand]

I had the same problem. this is because 4.0.0-beta.3 .please downgrade it to 4.0.0-beta.2
Detailed steps:
In you pakage.json
"bootstrap": "^4.0.0-beta.2" replace it with "bootstrap": "4.0.0-beta.2" ( remove the carrot sign)
npm uninstall
npm install
This must fix it.

[dereklin]

Just upgrade from 4.0.0-beta to 4.0.0 and experienced this problem with ng serve. Went back to 4.0.0-beta and ng serve is ok. This issue shouldn't be closed if it's a cli issue.

[dduft]

Simply upgrading to @angular/[email protected] solved the problem for me, like @Jimeh87 proposed.

[seanmavley]

@dduft But were we not informed ng cli 1.6.4+ would fix this issue, and on 1.6.4, I remember it was fixed.

Now on 1.6.5 and issue rears its ugly head. Is the CLI retrogressing?

@pranaysand The idea to downgrade doesn't ring well in my ears. On 1.6.3, it couldn't work with bootstrap 4.0.0-beta.3, so it had to be downgraded to work.

Now, on 1.6.5, to work, we need to downgrade to a beta of bootstrap?

[clydin]

Development builds were fixed. Production builds required additional changes which were already present but are only available in 1.7 (currently in beta). The stylesheet optimization pipeline was rewritten providing both increased performance and fixing multiple underlying issues. This however cannot be published in a patch release hence its presence in 1.7 and not 1.6.x.

[limpygnome]

cli 1.7.0-beta.1 fixes the issue when using the latest released bootstrap (4.0.0) (not beta) as well.

[aregotech]

Just globally update your angular/cli before starting a new project:
npm i -g @angular/cli
It works with beta 3, too !

[nolvia80]

Hi all!
I read all of yours comment and after I follow most of logs that the npm leave on my console (after a boring fight with bootstrap), so I uninstall and reinstall:
npm uninstall bootstrap --save subsequently npm install [email protected] --save so I see in the console: this warning:

npm WARN [email protected] requires a peer of [email protected] - 3 but none is installed. You must install peer depe
ndencies yourself.
npm WARN [email protected] requires a peer of popper.js@^1.12.3 but none is installed. You must install peer dep
endencies yourself.

I follow the suggest, so npm install [email protected] --save and npm install popper.js@^1.12.3 --save
finally: npm install and ng serve and IT WORK!!!

[monuthakur]

It's work.Thanks

[plamf]

Updated bootstrap to 4.0.0 "stable" today in hopes of this being fixed => it isn't
Followed @jameskentTX advice and deleted the suspect lines from bootstrap's package.json. Now it works.

This is very hacky though.

[mmisztal1980]

I'm using bootstrap 4.0.0 with CLI v 1.6.5. I'm still getting this error

[wags]

Using Angular CLI 1.7.0 beta 2 worked for me today. Thank you to everyone who mentioned it! 💯

[limpygnome]

Anyone using cli 1.7.0 betas may have issues with 404s / blank pages when reloading the page, e.g. when using ng serve, as there's a cli bug. I've put a work around on this ticket:
https://github.com/angular/angular-cli/issues/9297

[chandermani]

I tried [email protected] with Angular CLI 1.6.6 (local and global), and it worked fine.

[tmrfouad]

i used [email protected] and @angular/[email protected] and still not working

[alanreji]

Step 1.
Inside .angular-cli.json

"styles": [
        "styles.css",
        "../node_modules/bootstrap/dist/css/bootstrap.min.css" 
 ]

Remove "../node_modules/bootstrap/dist/css/bootstrap.min.css"

Step 2.
Go to styles.css

Import bootstrap by adding this line
@import "~bootstrap/dist/css/bootstrap.css";

These steps solved the errors I got during the building process.

[tojarr]

Have the same problem.

ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/bootstrap/dist/css/bootstrap.min.css
Module build failed: BrowserslistError: Unknown browser major
    at error (E:\notWork\angular4Course\directives-deep\node_modules\browserslist\index.js:37:11)
...

I just started to learn Angular, I don't need bootstrap 4. I just want the simplest solution to make my project alive again. So I downgraded a bootstrap.

1. In package.json file I changed to "bootstrap": "3.3.7",
2. then run npm install
3. after that ng serve --open

[ramzanh]

I'm using bootstrap 4.0.0 with CLI v 1.6.3.

@import "~bootstrap/scss/bootstrap";

This worked for me.

[abnersouza]

The "BrowserslistError: Unknown browser major scss" bug is still happening in the latest bootstrap 4.0.0 and CLI 1.6.6, to solve the issue i had to downgrade bootstrap to 4.0.0-beta.2 without the caret with the caret got the same error as well.

[tmrfouad]

@alanreji i tried ur solution and it worked perfectly ... thnx

[mokth]

1. change the style.css to scss (and all the css to scss also).
2. @import "../node_modules/bootstrap/scss/bootstrap.scss"; --> put this in the first line of style.scss
3. remove the bootstrap.css or bootstrap.min.css at the angular-cli.json
   ng build --prod
   everything work accordingly.
   Thank guys.....

[marshallcool]

thank you all for your help, the problem is solved!

[SteveIngels]

@mokth Are you saying you had to convert EVERY css file used in the project to scss or just the bootstrap files you're using/importing?

[gabrielemilan]

Installing angular cli 1.6.6 solve the problem for me!

[ernitishkumar]

1.6.6 does not solves the issue !

[joseph-schenck]

@SteveIngels Just tried the solution @mokth provided.

You'll need to remove "../node_modules/bootstrap/dist/css/bootstrap.min.css" from .angular-cli.json.
Then change "styles.css" to "styles.scss" in .angular-cli.json.
Then change the actual file style.css to style.scss and add @import "../node_modules/bootstrap/scss/bootstrap.scss" to the top of the file.

[jglisson]

@joseph-schenck this solution worked and feels like the correct fix.

angular-cli 1.4.10 (have to run Angular 4 bc of LTS)
bootstrap 4.0.0

[Nosfistis]

@jglisson this solution uses scss instead of the plain bootstrap compiled css, and skips the angular-cli way of styles inclusion by directly importing it to the main styles.css file.

It certainly does not seem to be an appropriate fix.

[jglisson]

@Miced thanks for your response.

It seemed appropriate because it doesn't alter the package.json browserlist for bootstrap. It uses the sass implementation rather than the css implementation, which seems fine to me.

What do you suggest?

[Nosfistis]

The next beta version, @angular/[email protected], successfully built in production mode without changing any of my files, as suggested by @filipesilva. I am using it already without any other issues.

[jglisson]

We are required to use Angular 4 because of LTS.

[clydin]

1.7 will still support building Angular 4; as does 1.5 and 1.6. If you are encountering problems doing so, please open an issue describing the problem.

[jglisson]

Thanks @clydin

This may sound dumb then (and off topic, so I apologize). But how do you use ng new to create an angular 4 project with cli 1.5/6/7? I have been searching online quite a bit and the only thing I've found is using cli 1.4.10 (because 1.4.9 has an issue).

[yaswanth89kumar]

The same problem i faced today.

I found my CLI was not upgraded. I upgraded my CLI globally and locally and it worked fine.
So always its good to upgrade our Angular CLI and then try to install packages.

[mauricewipf]

Bootstrap v4.0.0 has been released on Jan 18, 2018. So going to v4.0.0-alpha.x cannot be the best solution :-/

[jglisson]

I did the same as @yaswanth89kumar . I setup my project using angular-cli 1.4.10 and then upgraded the cli to latest.

[WuglyakBolgoink]

• angular/[email protected]
• bootstrap v4.0.0

Module build failed: ModuleBuildError: Module build failed: BrowserslistError: Unknown browser major

"styles": [
        "../node_modules/bootstrap/scss/bootstrap.scss",
        "styles.scss"
      ]
+

"defaults": {
    "styleExt": "scss",
    "component": {}
  }

hot-fix see in last comment @joseph-schenck

[zhekaus]

@angular/cli: 1.7.0-rc.0 solved the problem

[bomberblue07]

While updating to @angular/cli: 1.7.0-rc.0 allowed my code to compile with --prod, all of my font-awesome icons in my app were replaced by squares

[Matmo10]

@bomberblue07 Same for me. 1.7.0-beta.1 Seems to solve both issues though.

But there's definitely some font issues in the newer 1.7.x versions.

For example, in my angular-cli.json styles section I might have "./assets/fonts/icon-fonts/icon-fonts.css", and in that css file I might have:

@font-face {
    font-family: "My icon fonts";
    src:url('./icon-fonts.eot');
    src:url('./icon-fonts.eot?#iefix') format('embedded-opentype'),
        url('./icon-fonts.woff') format('woff'),
        url('./icon-fonts.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

and then the browser has warnings about these woff/tff files being corrupted. I even downloaded them and compared them to the original, and they are in fact different.

I believe the error was introduced in 1.7.0-beta2 or 3. @filipesilva

[zhekaus]

@bomberblue07 , @Mathou54 , https://github.com/angular/angular-cli/issues/9557

[spelbreker]

update to ng cli 1.6.8 in project and global. works with bootstrap 4.0

[kylebradshaw]

"bootstrap": "4.0.0-beta.2" is the sauce

[charsi]

Changed cli version to 1.7.0 in package.json. Working as expected now.

[robisonkarls]

@joseph-schenck solution solved my problem

[JeckyOH]

Removing the caret ‘^’ of "bootstrap: ^4.0.0-beta.2" solved the problem.
Thanks for @oopsmails

[vicanand]

i have removed following two line from bootstrap/package.json file

"last 1 major version",
">= 1%",

[ramkrishnakuldeep]

@oopsmails
Thank you

[sunil237216]

"bootstrap": "4.0.0-beta.2" worked for me.

[andremarcondesteixeira]

updating bootstrap to 4.1.3 worked for me. I was facing this issue with bootstrap version 4.1.1

[wandersonsc]

Ha! that's odd, "node_modules/bootstrap/dist/css/bootstrap.min.css", did the trick.

bootstrap": "^4.1.3",
Angular CLI: 6.1.3

[saiyaff]

@wandersonsc Probably the cli path tracking has changed I guess 🤔

I was facing the same issue with the bootstrap version 4.1.3 and cli v 6.1.4.
"node_modules/bootstrap/dist/css/bootstrap.min.css" did really solve it 😲

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

<sub>_This action has been performed automatically by a bot._</sub>