Блог

Я получаю эту неясную ошибку от SCSS: Unexpected character '' (1:4)

Failed to compile
./components/layout/Layout.scss
ModuleParseError: Module parse failed: Unexpected character '' (1:4)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)

хотя это мой файл SCSS Layout.scss :

 @import './sass-tools';
@import './normalize';
@import './custom-base';

.page-wrapper {
    position: relative;
    max-width: $page-max-width;
    margin: 0 auto;

    amp;.nobp {
        max-width: none;
        width: 1224px;
    }
}

.page-content {
    position: relative;
    background-color: $white;

    .nobp amp; {
        width: 1024px;
    }
}
  

Это моя структура папок:

 ./components/layout/
 ∟ Layout.jsx
 ∟ Layout.scss
 ∟ Layout.test.js
 ∟ _fonts.scss
 ∟ _sass-tools.scss
 ∟ custom-base.scss
 ∟ normalize.scss
  

Для меня неясно, каким должен быть символ '' (1:4) . Я полагаю, что моя конфигурация Webpack в порядке, я могу опубликовать ее, если хотите, но SCSS до сих пор работала (с другими файлами) в моем проекте.

Я обнаружил проблему. Вывод компилятора SASS — полная чушь: вот что произошло:

Layout.scss импортирует custom-base.scss импортирует fonts.scss

это включает в себя .woff и .woff2 файлы. Я думаю, мне все еще нужно добавить загрузчик для этих