CommonsChunkPlugin 中的 webpack 错误:在正常模式下运行时，不允许使用非入口块

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

本文关键字：不允许 运行时 入口 模式 错误 webpack 中的 常模式 CommonsChunkPlugin      更新时间：2023-09-26

所以当我尝试将我的应用程序拆分为 1 个应用程序.js 个文件和 1 个库.js文件时，一切正常。 当我尝试将其拆分为 1 个应用程序.js文件和 2 个库.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'
    }
}

在 github 问题 #1016 之后，您需要根据入口点的定义颠倒插件定义中块名称的顺序

目前似乎是这个网络包插件的一个错误......

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')

从 CommonChunkPlugin 的两个条目切换到一个条目对我的情况有所帮助。

以前：

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

后：

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

它基于两个显式供应商块示例。

其他答案是关于CommonsChunkPlugin中名称的顺序，这是真的。但有时即使在您更正顺序（即与输入中给出的顺序相反）之后，webpack 仍然可能会抛出相同的错误。

这是当你使用另一个CommonsChunkPlugin实例来提取commons的时候 - 例如explicit-webpack-runtime-chunk，顺序再次很重要 - 这里是配置插件列表中的实例顺序。简单地说，将此实例移动到 CommonsChunkPlugin 之后以获得显式供应商块。例如

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
  })
]
相关文章：