×

webpack中的filename 和chunkFilename

96
fullbook
2017.02.20 19:25* 字数 256

如果觉得不错的话,请点一下赞吧 😊

filename:对应于entry里面生成出来的文件名。比如:
<pre>
module.exports = {
entry: {
app: 'app.js'
},
output: {
filename: '[name].min.js', // 生成出来的文件名为app.min.js。
chunkFilename: '[name].min.js'
}
};
</pre>
chunkname:个人理解chunkname就是未被列在entry中,但有些场景需要被打包出来的文件命名配置。比如按需加载(异步)模块的时候,这样的文件是没有被列在entry中的使用CommonJS的方式异步加载模块。比如:
<pre>
require.ensure(["modules/app.jsx"], function(require) {
var a = require("modules/app.jsx");
// ...
}, 'app');
</pre>
异步加载的模块是要以文件形式加载,所以这时生成的文件名是以chunkname配置的,生成出的文件名就是app.min.js。
require.ensure: 第三个参数是给这个模块命名,否则 chunkFilename: "[name].min.js"中的 [name]是一个自动分配的、可读性很差的id。

前端
Web note ad 1