Webpack錯誤：您可能需要適當的加載程序來處理此文件類型。 | @charset「UTF-8」;

Question

我試圖處理.scss文件用的WebPack 2.2.0反而得到它注入style標籤到我index.html文件，我想將它解壓到一個文件.css與ExtractTextPlugin。

以下是我的webpack.config.js文件：

// webpack.config.js 

let path = require('path'); 
let ExtractTextPlugin = require('extract-text-webpack-plugin'); 
let extractCSS = new ExtractTextPlugin('[name].css'); 

module.exports = { 
    context: path.resolve(__dirname, './src'), 
    entry: './index.js', 
    output: { 
     path: path.resolve(__dirname, 'dist'), 
     filename: 'bundle.js', 
     publicPath: 'dist/' 
    }, 
    module: { 
     rules: [ 
      { 
       test: /\.js$/, 
       use: 'babel-loader', 
      }, 
      { 
       test: /\.(sass|scss)$/, 
       use: [ 

        /////////////////////////////////////// 
        // THIS WONT WORK AND CAUSES THE ERROR 
        /////////////////////////////////////// 

        extractCSS.extract({ 
         fallbackLoader: 'style-loader', 
         loader: ['css-loader', 'sass-loader'] 
        }), 

        ///////////// 
        // THIS WORKS 
        ///////////// 

        // 'style-loader', 'css-loader', 'sass-loader' 
       ] 
      }, 
      { 
       test: /\.(eot|svg|ttf|woff|woff2)$/, 
       loader: 'file-loader?name=[path][name].[ext]' 
      } 
     ] 
    }, 
    plugins: [ 
     extractCSS 
    ] 
} 

任何幫助表示讚賞。謝謝。

Answer 1

這是ETP中的一個錯誤。我相信我的切換使用「加載器」，這將解決您的問題。

https://github.com/webpack/extract-text-webpack-plugin/issues/342#issuecomment-273914852