-
webpack入口为多页,每个页面中有懒加载的组件,打包出来懒加载的组件会打成不同id的文件名,但是没有模快名,分辨不出当前这个id属于哪个模块下,如果能让懒加载的文件带上模块名?
如:a.html a.js b.html b.js
//懒加载模块,分别对应a,b模块
1.js 2.js 3.js 4.js
//webpack配置
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
代码里的
[name]
默认是id
覆盖,如果你要给chunkFilename
重新起名字,要使用webpack1
的require.ensure()
或webpack2
以上的import()
方法。webpack1:
上面的
chunkName
对应的就是webpack
里的chunkFilename
里的[name]
webpack2-3:
上面的
import()
是webpack2
以上版本的写法,注意/* webpackChunkName: "foo" */
,这里对应的就是webpack
里的chunkFilename
里的[name]
具体使用方法,给你两个参考链接吧:
webpack1
的require.ensure()
: http://www.css88.com/doc/webp...webpack2-3
的import()
: https://webpack.js.org/api/mo...