Help: How to add the latest Bootstrap into Angular 4 projects

[faizy6641]

when i tried to run my server by command "ng serve" i am getting bellow 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.css
Module build failed: BrowserslistError: Unknown browser major
at error (C:\Users\faiyazs\Mar\node_modules\browserslist\index.js:37:11)
at Function.browserslist.checkName (C:\Users\faiyazs\Mar\node_modules\browserslist\index.js:320:18)
at Function.select (C:\Users\faiyazs\Mar\node_modules\browserslist\index.js:438:37)
at C:\Users\faiyazs\Mar\node_modules\browserslist\index.js:207:41
at Array.forEach ()
at browserslist (C:\Users\faiyazs\Mar\node_modules\browserslist\index.js:196:13)
at Browsers.parse (C:\Users\faiyazs\Mar\node_modules\autoprefixer\lib\browsers.js:44:14)
at new Browsers (C:\Users\faiyazs\Mar\node_modules\autoprefixer\lib\browsers.js:39:28)
at loadPrefixes (C:\Users\faiyazs\Mar\node_modules\autoprefixer\lib\autoprefixer.js:56:18)
at plugin (C:\Users\faiyazs\Mar\node_modules\autoprefixer\lib\autoprefixer.js:62:18)
at LazyResult.run (C:\Users\faiyazs\Mar\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:270:20)
at LazyResult.asyncTick (C:\Users\faiyazs\Mar\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:185:32)
at LazyResult.asyncTick (C:\Users\faiyazs\Mar\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:197:22)
at processing.Promise.then._this2.processed (C:\Users\faiyazs\Mar\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:224:20)
at new Promise ()
at LazyResult.async (C:\Users\faiyazs\Mar\node_modules\postcss-loader\node_modules\postcss\lib\lazy-result.js:221:27)
@ ./node_modules/bootstrap/dist/css/bootstrap.css 4:14-127
@ multi ./node_modules/bootstrap/dist/css/bootstrap.css ./src/styles.css

---

.angular-cli.json file:
"styles": [

    "../node_modules/bootstrap/dist/css/bootstrap.css",
    "styles.css"          

  ],
  "scripts":[ 
    "../node_modules/jquery/dist/jquery.slim.js",
    "../node_modules/popper.js/dist/umd/popper.js",
    "../node_modules/bootstrap/dist/js/bootstrap.js"

]
Package.json:

"bootstrap": "^4.0.0",
"core-js": "^2.4.1",
"jquery": "^3.3.1",
"popper.js": "^1.12.9",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
},

C:\Users\faiyazs\Mar>ng -v

_                      _                 ____ _     ___

/ \ _ __ __ _ _ | | __ _ _ __ / | | | |
/ △ \ | ' \ / _ | | | | |/ _ | '| | | | | | |
/ ___ | | | | (| | || | | (| | | | || | | |
// __| ||_, |_,||_,|| _|||
|___/

Angular CLI: 1.6.2
Node: 8.9.3
OS: win32 x64
Angular: 5.1.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.2
@angular-devkit/build-optimizer: 0.0.36
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.2
@schematics/angular: 0.1.11
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.10.0

[filipesilva]

This issue is a duplicate of #9020. Using Angular CLI 1.7.x will fix the problem.

[angular-automatic-lock-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.

_{This action has been performed automatically by a bot.}