Вам может понадобиться соответствующий загрузчик для обработки этого типа файла: Webpack 2

Question

Я обновился до Webpack 2, и у меня проблемы с моими загрузчиками. Моя структура проекта выглядит следующим образом:

. 
├── components 
│ └── App.js 
│ 
├── public 
│  └──css 
│   └──custom.css 
└── src 
    └──sass 
     └──custom.scss 

Внутри App.js

import '../src/sass/custom.scss' 

Внутри webpack.config.js module.exports =

{ 
    test: /\.scss$/, 
    exclude: /node_modules/, 
    loaders: ExtractTextPlugin.extract({ fallbackLoader: 'style-loader', loader: 'sass-loader' }), 
    include: __dirname + '/src/sass' 
} 

Внутри webpack.config.js плагинов

//Add Bourbon dependency 
    new webpack.LoaderOptionsPlugin({ 
    options: { 
     sassLoader: { 
     includePaths: require('bourbon').includePaths, 
     outputStyle: 'expanded', 
     }, 
     context: '/src/sass', 
    } 
    }) 

Мой продукт Тион скрипт в package.json

"production": "rm -rf public/index.html && NODE_ENV=production webpack -p && NODE_ENV=production node app.js" 

Но я получаю эту ошибку:

**Child extract-text-webpack-plugin: 
     [0] ./~/sass-loader!./src/sass/custom.scss 283 bytes {0} [built] [failed] [1 error]** 

ERROR in ./~/sass-loader!./src/sass/custom.scss 
Module parse failed: /Users/user/apps/project/node_modules/sass-loader/index.js!/Users/user/apps/project/src/sass/custom.scss Unexpected token (1:5) 
You may need an appropriate loader to handle this file type. 
| body { 
| background: white; 
| } 

Я не знаю, почему она не может найти свои загрузчики. Я переустановил все (css, sass, загрузчики стилей) и даже поместил их в разделы Dev и производственные зависимости.

Существует, похоже, много проблем с webpack 2 и плохой документацией. Здесь что-то не хватает?

Answer 1

Я считаю, что если вы используете regexp test, то вам не нужен ! Style-loader! Sass-loader! при вашем ввозе. Это может вызвать проблему, когда целая строка анализируется.