本来是个单页面一个入口的web项目,webpack配置如下
module.exports = {
entry: {
app:APP_FILE,
common: [
'react',
'react-dom',
'react-router',
'redux',
'react-redux',
'redux-thunk',
'immutable'
]
},
output: {
// publicPath: './js', //编译好的文件,在服务器的路径,域名会自动添加到前面
path: BUILD_PATH, //编译到当前目录
filename: '[name].js', //编译后的文件名字
chunkFilename: '[name].[chunkhash:5].min.js',
},
...
new webpack.optimize.CommonsChunkPlugin('common', 'common.bundle.js'),
然后上面让把注册拆出来,做成多入口的。题主想这很简单嘛,于是新建了
index.html;app.regist.js;router.register.js三个文件并把原先的路由进行了拆分,把原先路由中引入注册模块的内容都放在了新的路由里。
新的webpack配置如下
module.exports = {
entry: {
app:path.join(__dirname, './app/main.js'),
registerModule:path.join(__dirname, './app/main.register.js'),
vendor: [
'react',
'react-dom',
'react-router',
'redux',
'react-redux',
'redux-thunk',
'immutable'
]
},
output: {
//publicPath: './js/', //编译好的文件,在服务器的路径,域名会自动添加到前面
path: BUILD_PATH, //编译到当前目录
filename: '[name].js', //编译后的文件名字
chunkFilename: '[name].[chunkhash:5].min.js',
},
...
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
filename: 'vendor.bundle.js'
}),
但运行打包命令后,发现vendor.bundle.js变大了,从原先的250k左右涨到了950k,点开看了下发现里面包含了业务代码。为什么会这样呢。