CssSyntaxError Неизвестное построение слов с помощью Webpack 4

Module build failed (from ./node_modules/css-loader/dist/cjs.js):
    CssSyntaxError

    (1:4) Unknown word

    > 1 | // style-loader: Adds some css to the DOM by adding a <style> tag
        |    ^
      2 | 
      3 | // load the styles

     @ ./node_modules/vue-slider-component/theme/antd.css 4:14-338 14:3-18:5 15:22-346

У меня есть эта ошибка при создании моего приложения в Webpack 4. Это моя конфигурация загрузчика CSS:

{
    test: /\.css$/,
    use: ["vue-style-loader", "css-loader", "postcss-loader"]
},
{
    test: /\.scss$/,
    use: ["vue-style-loader", "css-loader", "postcss-loader", "sass-loader"]
}

Как я могу немного смягчить правила, чтобы они не терпели неудачу в таких вопросах?

Спасибо

🤔 А знаете ли вы, что...
Vue.js поддерживает компиляцию шаблонов и оптимизацию для лучшей производительности.


9
3 090
1

Ответ:

Решено

У вас не может быть нескольких css-загрузчиков. Вот возможное решение:

      {
        test: /\.(sa|sc|c)ss$/,
        use: [
          'vue-style-loader',
          'css-loader',
          'sass-loader',
          'postcss-loader',
        ]
      }