我正在使用Angular和Typescript开发一个Web应用程序。我正在尝试添加到我的项目中。我是Angular和Typescript的新手。我点击了这个链接 - Angular 4:如何包含引导?当我运行我的项目时,它给了我错误。
我使用 npm 运行以下命令安装了所需的包
npm install bootstrap@next --save
npm install jquery --save
npm install popper.js --save
然后在angular-cli.json中,我像这样修改了样式和脚本。
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"styles.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/popper.js/dist/umd/popper.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js"
],
当我运行代码时,我收到此错误。
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 (C:UsersAcerDesktopumyataungwebnode_modulesbrowserslistindex.js:37:11)
at Function.browserslist.checkName (C:UsersAcerDesktopumyataungwebnode_modulesbrowserslistindex.js:320:18)
at Function.select (C:UsersAcerDesktopumyataungwebnode_modulesbrowserslistindex.js:438:37)
at C:UsersAcerDesktopumyataungwebnode_modulesbrowserslistindex.js:207:41
at Array.forEach (<anonymous>)
at browserslist (C:UsersAcerDesktopumyataungwebnode_modulesbrowserslistindex.js:196:13)
at Browsers.parse (C:UsersAcerDesktopumyataungwebnode_modulesautoprefixerlibbrowsers.js:44:14)
at new Browsers (C:UsersAcerDesktopumyataungwebnode_modulesautoprefixerlibbrowsers.js:39:28)
at loadPrefixes (C:UsersAcerDesktopumyataungwebnode_modulesautoprefixerlibautoprefixer.js:56:18)
at plugin (C:UsersAcerDesktopumyataungwebnode_modulesautoprefixerlibautoprefixer.js:62:18)
at LazyResult.run (C:UsersAcerDesktopumyataungwebnode_modulespostcss-loadernode_modulespostcssliblazy-result.js:277:20)
at LazyResult.asyncTick (C:UsersAcerDesktopumyataungwebnode_modulespostcss-loadernode_modulespostcssliblazy-result.js:192:32)
at LazyResult.asyncTick (C:UsersAcerDesktopumyataungwebnode_modulespostcss-loadernode_modulespostcssliblazy-result.js:204:22)
at LazyResult.asyncTick (C:UsersAcerDesktopumyataungwebnode_modulespostcss-loadernode_modulespostcssliblazy-result.js:204:22)
at processing.Promise.then._this2.processed (C:UsersAcerDesktopumyataungwebnode_modulespostcss-loadernode_modulespostcssliblazy-result.js:231:20)
at new Promise (<anonymous>)
@ ./node_modules/bootstrap/dist/css/bootstrap.min.css 4:14-131
@ multi ./node_modules/bootstrap/dist/css/bootstrap.min.css ./src/styles.css
按照这个解决方案- https://github.com/angular/angular-cli/issues/9080,我也降级了我的 CLI
"@angular/cli": "1.6.3"
当我运行代码时,它给了我同样的错误。我的代码有什么问题?
我认为您的安装和设置是正确的,但是接下来import
bootstrap.min.css
文件中的文件style.css
像这样。
风格.css
@import '~bootstrap/dist/css/bootstrap.min.css';
您可以阅读有关如何在 Angular 中安装和设置引导程序的完整博客,单击此处阅读有关此的完整博客