2016-09-19 15 views
0

現在、私はReassプロジェクトでSassを働かせています。ガイドの中で私はすべてがうまくいきましたが、にExtractTextPluginを使用する必要があるとすぐにエラーが表示されます。私の主なSASSファイルはroot/style.main.scssに位置しており、それがこのようなDOMに私のアプリをレンダリング私のindex.jsに含まれている:import style from '../style/main.scss';Sassローダーを使用したエラーwebpack

webpack.config.js:

module.exports = { 
    entry: './src/index.js', 
    output: { 
    path: __dirname, 
    filename: 'bundle.js' 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /.jsx?$/, 
     loader: 'babel-loader', 
     exclude: /node_modules/, 
     query: { 
      presets: [ 
      'es2015', 
      'react' 
      ] 
     } 
     }, 
     { test: /\.css$/, exclude: /\.useable\.css$/, loader: "style!css" }, 
     { test: /\.useable\.css$/, loader: "style/useable!css" }, 
     // sass 
     { 
     test: /\.scss$/, 
     loader: ExtractTextPlugin.extract('css!sass') 
     } 
    ] 
    }, 
    plugins: [ 
     new ExtractTextPlugin('public/style.css', { 
      allChunks: true 
     }) 
    ], 
    resolve: { 
    extensions: ['', '.js', '.jsx'] 
    }, 
    devServer: { 
    proxy: { 
     '/api/*': { 
     target: 'http://mab-cmdb.dev', 
     secure: false, 
     changeOrigin: true 
     } 
    } 
    }, 
}; 

EDIT:WebPACKのエラー

/Users/jordykoppen/git/mab-cmdb-v2-frontend/webpack.config.js:25 
     loader: ExtractTextPlugin.extract('css!sass') 
       ^

ReferenceError: ExtractTextPlugin is not defined 
    at Object.<anonymous> (/Users/jordykoppen/git/mab-cmdb-v2-frontend/webpack.config.js:25:17) 
    at Module._compile (module.js:409:26) 
    at Object.Module._extensions..js (module.js:416:10) 
    at Module.load (module.js:343:32) 
    at Function.Module._load (module.js:300:12) 
    at Module.require (module.js:353:17) 
    at require (internal/module.js:12:17) 
    at module.exports (/usr/local/lib/node_modules/webpack-dev-server/node_modules/webpack/bin/convert-argv.js:80:13) 
    at Object.<anonymous> (/usr/local/lib/node_modules/webpack-dev-server/bin/webpack-dev-server.js:62:48) 
    at Module._compile (module.js:409:26) 

ありがとうございます。

+0

デバッグログには実際のエラーが含まれていないため、あまり有用ではありません。手動でWDSを起動し、質問にエラーを追加できますか? 'webpack-dev-server --progress --colors --inline' – robertklep

+0

@robertklep申し訳ありません、私は私の質問を編集しました。 –

答えて

1

あなたのWebPACKの構成は次の行が欠落しています。

var ExtractTextPlugin = require("extract-text-webpack-plugin"); 

the documentationを参照してください。

+0

それは助けてくれてありがとう! –

関連する問題