WebパッケージのCommonsChunkPluginでエラーが発生しました：ノンエントリチャンクを使用することはできません。

Question

アプリケーションを1つのapplication.jsファイルと1つのlibraries.jsファイルに分割しようとすると、すべて正常に動作します。私は1つのapplication.jsファイルと2 libraries.jsファイルにそれを分割しようとすると構築するとき、私はこのエラーを取得する：

ERROR in CommonsChunkPlugin: While running in normal mode it's not allowed to use a non-entry chunk (libraries-react)

誰でもこのエラーを引き起こしている可能性があります知っていますか？

WebPACKのための私の設定がある

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

var extractSass = new ExtractTextPlugin('main.css'); 

module.exports = { 
    module: { 
     loaders: [{ 
      test: /\.jsx$/, 
      loader: 'babel', 
      exclude: ['./node_modules'], 
      query: { 
       presets: ['react', 'es2015'] 
      } 
     }, { 
      test: /\.scss$/, 
      loader: extractSass.extract(['css', 'sass']) 
     }, { 
      test: /\.html$/, 
      loader: 'file?name=[name].[ext]' 
     }, { 
      test: /\/misc\/.*\.js$/, 
      loader: 'file?name=/misc/[name].[ext]' 
     }, { 
      test: /\.(png|jpg|jpeg|)$/, 
      loader: 'file?name=/images/[name].[ext]' 
     }] 
    }, 
    plugins: [ 
     extractSass, 
     new webpack.optimize.CommonsChunkPlugin('libraries-core', 'libraries-core.js'), 
     new webpack.optimize.CommonsChunkPlugin('libraries-react', 'libraries-react.js') 
    ], 
    entry: { 
     //3rd party libraries 
     'libraries-core': [ 
      'lodash', 
      'superagent', 
      'bluebird', 
      'eventemitter3', 
      'object-assign', 
      'schema-inspector', 
      'jsuri', 
      'store-cacheable', 
      'immutable' 
     ], 

     'libraries-react': [ 
      'react', 
      'react-dom', 
      'react-router', 
      'nucleus-react' 
     ], 

     //application code 
     application: './web/app/application.jsx', 

     //mocks 
     'mocked-api': './web/app/mock/api.js', 
     'mocked-local-storage': './web/app/mock/local-storage.js' 
    }, 
    output: { 
     path: './web/build', 
     publicPath: '/build', 
     filename: '[name].js' 
    } 
} 

Answer 1

github issue#1016に続いて、あなたは、エントリポイント定義

それがバグのように思えるに係るプラグインの定義におけるチャンク名の順序を逆にする必要があります当分のために、このWebPACKのプラグイン...

new webpack.optimize.CommonsChunkPlugin('libraries-react', 'libraries-react.js') 
new webpack.optimize.CommonsChunkPlugin('libraries-core', 'libraries-core.js') 

または

new webpack.optimize.CommonsChunkPlugin({names: ['libraries-react', 'libraries-core'], filename: '[name].js') 

Answer 2

私のケースでは、CommonChunkPluginの2つのエントリから1つのエントリに切り替えることができました。それは、two-explicit-vendor-chunks例に基づいています

plugins: [ 
    new webpack.optimize.CommonsChunkPlugin({ 
     names: ['libraries-core', 'libraries-react'], 
     minChunks: Infinity 
    }) 
] 

：後

plugins: [ 
    new webpack.optimize.CommonsChunkPlugin('libraries-core', 'libraries-core.js'), 
    new webpack.optimize.CommonsChunkPlugin('libraries-react', 'libraries-react.js') 
] 

：前

。

Answer 3

他の答えは、CommonsChunkPluginの名前の順番について言及しています。しかし、時にはあなたが注文を修正した後でさえ、（すなわち、エントリーで与えられた注文の逆）、webpackは同じエラーを投げるかもしれません。

これは、別のCommonsChunkPluginインスタンスを使用してコモンズを抽出するときです。明示的なwebpackランタイムチャンク、再び注文の問題 - ここでは、設定のプラグインリストのインスタンスの順序です。単純に、このインスタンスをCommonsChunkPluginの後に明示的ベンダーチャンクのために移動します。たとえば、あなたは2017年にこれに来ている場合は

plugins: [ 
    // explicit-vendor-chunk 
    new CommonsChunkPlugin({ 
    names: ["vendor-2", "vendor-1"], 
    minChunks: Infinity 
    }), 

    // and the following should go after explicit-vendor-chunk 
    // in the list of plugins 

    // explicit-webpack-runtime-chunk 
    new CommonsChunkPlugin({ 
    name: "manifest", // something that's not an entry 
    minChunks: Infinity 
    }) 
]