不兼容的单位:"rem"和"px"-Bootstrap 4和Laravel Mix [英] Incompatible units: 'rem' and 'px' - Bootstrap 4 and Laravel Mix

问题描述

我刚刚安装了新的Laravel 5.4，并引导了4 alpha6.Laravel混合不会编译SASS: 这是一个错误:

I just installed a fresh Laravel 5.4, and bootstrap 4 alpha 6. Laravel mix wont compile SASS: Here is one error:

    Module build failed: ModuleBuildError: Module build failed: 
$input-height:                   (($font-size-base * $input-line-height) + ($input-padding-y * 2)) !default;
                                ^
      Incompatible units: 'rem' and 'px'.
      in /Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/bootstrap/scss/_variables.scss (line 444, column 34)
    at runLoaders (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/webpack/lib/NormalModule.js:192:19)
    at /Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/loader-runner/lib/LoaderRunner.js:364:11
    at /Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/loader-runner/lib/LoaderRunner.js:230:18
    at context.callback (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at Object.asyncSassJobQueue.push [as callback] (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/sass-loader/lib/loader.js:57:13)
    at Object.<anonymous> (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/sass-loader/node_modules/async/dist/async.js:2262:31)
    at apply (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/sass-loader/node_modules/async/dist/async.js:20:25)
    at Object.<anonymous> (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/sass-loader/node_modules/async/dist/async.js:56:12)
    at Object.callback (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/sass-loader/node_modules/async/dist/async.js:944:16)
    at options.error (/Volumes/HDD/nicolae/Dev/htdocs/test/node_modules/node-sass/lib/index.js:294:32)

 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

有人通过了吗?以及如何?

Someone passed this? And how?

推荐答案

已解决

1. 从package.json中删除引导项，并将其替换为 "bootstrap":"4.0.0-alpha.6"，位于resources/assets/sass/app.scss中，
2. 注释掉变量的导入.将引导程序的路径更改为 @import"node_modules/bootstrap/scss/bootstrap.scss";
3. 在resources/assets/js/bootstrap.js中，查找require('bootsrap-sass'); 并将其更改为require('bootstrap');

1. remove the bootstrap entry from package.json and replace it with "bootstrap": "4.0.0-alpha.6", in resources/assets/sass/app.scss,
2. comment out the import of variables. change the path of bootstrap to @import "node_modules/bootstrap/scss/bootstrap.scss";
3. in resources/assets/js/bootstrap.js, look for require('bootsrap-sass'); and change it to require('bootstrap');

链接！

这篇关于不兼容的单位:"rem"和"px"-Bootstrap 4和Laravel Mix的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！