首页 文章

Bootstrap 4 beta 3使用angular-cli抛出错误

提问于
浏览
6

我将我的引导程序包更新到4.0.0-beta.3时出现以下错误 . 如果我错过任何东西,请告诉我 . 它正在与beta.2合作

"@angular/animations": "^5.1.2",
"@angular/common": "^5.1.2",
"@angular/compiler": "^5.1.2",
"@angular/core": "^5.1.2",
"@angular/forms": "^5.1.2",
"@angular/http": "^5.1.2",
"@angular/platform-browser": "^5.1.2",
"@angular/platform-browser-dynamic": "^5.1.2",
"@angular/router": "^5.1.2",
"bootstrap": "^4.0.0-beta.3",
"@angular/cli": "^1.6.3",
"@angular/compiler-cli": "^5.1.2",
"@angular/language-service": "^5.1.2",

错误在./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模块构建失败:BrowserslistError:未知的浏览器主要错误(E:********* \ node_modules \ browserslist \ index.js:37:11)在Function.browserslist.checkName(E:) * \ node_modules \ browserslist \ index.js:320:18)在E:的Function.select(E:*** \ node_modules \ browserslist \ index.js:438:37) ***** \ node_modules \ browserslist \ index.js:207:41位于browserslist的Array.forEach()(E:********* \ node_modules \ browserslist \ index.js:196:13)在新浏览器的浏览器(E:********* \ node_modules \ autoprefixer)中的浏览器\ lib \ browsers.js:39:28)在插件的loadPrefixes(E:********* \ node_modules \ autoprefixer \ lib \ autoprefixer.js:56:18)处(E:) **** \ node_module s \ autoprefixer \ lib \ autoprefixer.js:62:18)在LazyResult.run(E:****** \ node_modules \ postcss-loader \ node_modules \ postcss \ lib \ lazy-result.js:270) :20)在LazyResult.asyncTick上的LazyResult.asyncTick(E:********* \ node_modules \ postcss-loader \ node_modules \ postcss \ lib \ lazy-result.js:185:32)(E:位于LazyResult.asyncTick的******* \ node_modules \ postcss-loader \ node_modules \ postcss \ lib \ lazy-result.js:197:22)(E:********* \ node_modules \ postcss-loader \ node_modules \ postcss \ lib \ lazy-result.js:197:22)在processing.Promise.then._this2.processed(E:********* \ node_modules \ postcss-loader \ node_modules) \ postcss \ lib \ lazy-result.js:224:20)在新的Promise()@ . / node_modules / bootstrap / scss / bootstrap.scss 4:14-164 @ multi ./node_modules/bootstrap/scss/bootstrap.scss ./node_modules/font-awesome/scss/font-awesome.scss ./node_modules/ng2-toastr/bundles/ng2-toastr.min.css ./node_modules/owl.carousel/dist/assets/owl.carousel.css . /node_modules/owl.carousel/dist/assets/owl.theme.default.css ./node_modules/froala-editor/ css / froala_editor.pkgd.min.css ./node_modules/froala-editor/css/froala_style.min.css ./node_modules/ng-pick-datetime/assets/style/picker.min.css ./src/styles.scss

4 回答

  • 0

    您可以使用Bootstrap 4 beta 3,但首先在node_modules / bootstrap中编辑bootstrap.json / package.json:

    “browserslist”:[“最后1个主要版本”,<-----删除此行“> = 1%”,<-----删除此行“Chrome> = 45”,“Firefox> = 38 “,”Edge> = 12“,”Explorer> = 10“,”iOS> = 9“,”Safari> = 9“,”Android> = 4.4“,”Opera> = 30“],

    看起来在浏览器列表2.4中添加了最后的n个主要版本语法,并且在7.0版中将autoprefixer更新为browserList的版本2 .

    因此,7.0以上的任何版本的autoprefixer都应该有效 .

    更新autoprefixer也应该为您完成这项工作 .

  • 0

    这是由_cl2554_的angular-cli引起的,临时修复是

    • 不要在 .angular-cli.json 中引用bootstrap的css / scss,

    • 在您应用的 style.scss 文件中导入bootstrap的scss文件,如下所示:

    scss
    @import '~bootstrap/scss/bootstrap.scss';
    

    有关详细信息,请查看我的ng-seed repo .

  • 3

    我没有使用angular,但是遇到了与bootstrap v . “4.0.0”相同的问题:

    import "bootstrap/scss/bootstrap.scss";

    "autoprefixer": "^7.2.5" 添加到我的package.json为我工作 .

  • 15

    我已升级到Angular CLI 1.7.x,它开始正常工作 . 我推荐这个解决方案 . 我的意思是升级Angular CLI,它应该适合你!

    @Yashwanth M解决方案应该在最坏的情况下工作!

相关问题