Webpack 2用のextract-text-webpack-pluginを使用したreact-widgets-webpackの使用方法

Question

のレスポンスウィジェットを使用する場合、 extract-text-webpack-pluginとWebpack 2のwebpack次のエラーを取得する：

styleLoader: require('extract-text-webpack-plugin').extract({ 
     fallback: "style-loader", 
     use: 'css-loader!less-loader' 
    }) 

に変更

ERROR in ./~/react-widgets-webpack/index.loader.js!./react-widgets.config.js Module build failed: Error: Breaking change: extract now only takes a single argument. Either an options object or the loader(s). Example: if your old code looked like this: ExtractTextPlugin.extract('style-loader', 'css-loader')

You would change it to: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' })

は、次のエラーを与える：

ERROR in ./~/react-widgets-webpack/index.loader.js!./react-widgets.config.js Module not found: Error: Can't resolve '[object Object],[object Object],[object Object],[object Object]' in '/Users/pbirmingham/Development/FLA/forks/flash/flash'

マイwebpack.config.js：

const webpack = require('webpack'); 
const globalizePlugin = require('globalize-webpack-plugin'); 
const HtmlWebpackPlugin = require('html-webpack-plugin'); 
const ExtractTextPlugin = require("extract-text-webpack-plugin"); 

module.exports = { 
    entry: { 
     app: [ 
      'react-widgets-webpack!./react-widgets.config.js', 
      'bootstrap-loader', 
      './js/main.js'] 
    }, 
    output: { 
     path: './public/', 
     filename: 'js/bundle-[hash].js', 
    }, 
    module: { 
     rules: [ 
      {test: /\.(js|jsx)$/, exclude: /node_modules/, use: 'babel-loader'}, 
      {test: /\.json$/, use: 'json-loader'}, 
      { 
       test: /\.(css|scss)$/, 
       use: ExtractTextPlugin.extract({ 
        fallback: "style-loader", 
        use: ['css-loader', 'sass-loader'] 
       }) 
      }, 
      { 
       test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, 
       use: "url-loader?name=[name].[hash].[ext]&limit=10000&mimetype=application/font-woff" 
      }, 
      {test: /\.(ttf|eot|svg|gif)$/, use: "file-loader?name=[name].[hash].[ext]"}, 
      {test: /bootstrap.+\.(jsx|js)$/, use: 'imports-loader?jQuery=jquery,$=jquery,this=>window'} 
     ] 
    }, 
    plugins: [ 
     new ExtractTextPlugin({ filename: 'css/main.[contenthash].css'}), 
     new globalizePlugin({ 
      production: false, 
      developmentLocale: "en", 
      supportedLocales: ["en"], 
      output: "globalize-compiled-data-[locale].[hash].js" 
     }), 
     new HtmlWebpackPlugin({ 
      template: 'template/index.ejs', 
      chunks: ['app'] 
     }), 
     new webpack.DefinePlugin({ 
      'process.env': { 
       NODE_ENV: JSON.stringify('production') 
      } 
     }) 
    ] 
} 

誰がこの動作を見ていますか？

Answer 1

私は同じ問題を抱えていました。 package.jsonで設定すると、loader: ExtractTextPlugin.extract('style', 'css!less')のようにExtractTextPluginローダーを定義する

のように定義します。 "extract-text-webpack-plugin": "~0.8.0"