Несовместимые единицы: 'rem' и 'px' - Bootstrap 4 и Laravel Mix

Я только что установил новый Laravel 5.4 и bootstrap 4 alpha 6. Laravel mix не будет компилировать SASS: Вот одна ошибка:

    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

Кто-то передал это? И как?

Ответы

Ответ 1

Решено

  • удалите запись bootstrap из package.json и замените ее "bootstrap": "4.0.0-alpha.6", в ресурсах/активах/sass/app.scss,
  • Запишите импорт переменных. изменить путь бутстрапа на @import "node_modules/bootstrap/scss/bootstrap.scss";
  • в ресурсах/активах/js/bootstrap.js, найдите require ('bootsrap-sass'); и измените его на требование ( "bootstrap" );

Ссылка!

Ответ 2

Случилось так же, как и вы, переопределение некоторых переменных является причиной этой ошибки.

Чтобы исправить это, просто прокомментируйте эту строку в ресурсах/ресурсах/sass/_variables:

$font-size-base: 14px;

В переменных, если вам нужны, используются другие переменные, которые предоставляет laravel.

ссылка: https://github.com/twbs/bootstrap/issues/18368