Javascript 即使在webpack配置中拆分了bundle.js文件,供应商代码仍在其中

Javascript 即使在webpack配置中拆分了bundle.js文件,供应商代码仍在其中,javascript,reactjs,webpack,Javascript,Reactjs,Webpack,使用下面的webpack配置,我仍然可以在bundle.js文件中获得供应商代码。(即使在代码拆分之后,bundle.js的大小仍然相同)。 我希望bundle.js中不应存在供应商代码 跟踪了某些链接,但没有帮助。() 根据Webpack文档,CommonChunkPlugin已弃用,并在版本4之后删除。原因是——这可能是它不适用于您的原因,它在异步块上被证明是低效的,而且也很难使用(例如:当children设置为true时,这仅适用于直接子级),因此配置中不会包含带有共享模块的3级依赖项

使用下面的webpack配置,我仍然可以在bundle.js文件中获得供应商代码。(即使在代码拆分之后,bundle.js的大小仍然相同)。 我希望bundle.js中不应存在供应商代码

跟踪了某些链接,但没有帮助。()


根据Webpack文档,CommonChunkPlugin已弃用,并在版本4之后删除。原因是——这可能是它不适用于您的原因,它在异步块上被证明是低效的,而且也很难使用(例如:当children设置为true时,这仅适用于直接子级),因此配置中不会包含带有共享模块的3级依赖项

请改为选择。这会解决你的问题

'use strict';

 var webpack = require('webpack');

module.exports = {
context: __dirname + '/client/js',
entry: {
    source: ['./init.jsx'],
    vendor: ['react',
        'react-dom',
        'redux',
        'axios',
        'ramda-fantasy',
        'ramda',
        'react-json-tree',
        'react-tooltip',
        'validator']
},
output: {
    filename: "[name].bundle.js"
},
resolve: {
    modulesDirectories: ['node_modules'],
    extensions: ['', '.js', '.jsx']
},
module: {
    loaders: [
        { test: /\.json$/, loader: 'json-loader' },
        {
            loader: 'babel-loader',
            exclude: /node_modules/,
            query: {
                presets: ['react', 'es2015', 'stage-0']
            }
        },
        { test: /\.css$/, loader: "css-loader" },
    ]
},

plugins: [new webpack.optimize.CommonsChunkPlugin({
    name: 'vendor',
    chunks: ['vendor'],
    filename: 'vendor.js',
    minChunks: Infinity
})
],

devtool: 'source-map',

node: {
    console: true,
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
},

 target: 'web'
};