var htmlWebpackPlugin = require('html-webpack-plugin');
//commom.js的模块化输出
module.exports={
entry:{
main:'./src/script/main.js',
a: './src/script/a.js',
b: './src/script/b.js',
c: './src/script/c.js'
},//入口文件
output:{
path:'./dist',
filename:'js/[name]-[chunkhash].js',
// publicPath:"http://cdn.com/"
},
plugins:[
new htmlWebpackPlugin({
filename:'a.html',
template:'index.html',
title:"webapck is a",
inject:'body',
chunks:['main','a']
}),
new htmlWebpackPlugin({
filename:'b.html',
template:'index.html',
title:"webapck is b",
inject:'body',
chunks:['b']
}),
new htmlWebpackPlugin({
filename:'c.html',
template:'index.html',
title:"webapck is c",
inject:'body',
chunks:['c']
})
]
};除了a页面可以生成，b.html和c.html都有错误
Html Webpack Plugin: <pre> TypeError: Cannot read property 'entry' of undefined - index.html:17237 D:/dwf/study/webpacklearn/index.html:17237:42 - index.html:17240 module.exports D:/dwf/study/webpacklearn/index.html:17240:3 - index.js:265 [webpacklearn]/[html-webpack-plugin]/index.js:265:16 - util.js:16 tryCatcher [webpacklearn]/[bluebird]/js/release/util.js:16:23 - promise.js:512 Promise._settlePromiseFromHandler [webpacklearn]/[bluebird]/js/release/promise.js:512:31 - promise.js:569 Promise._settlePromise [webpacklearn]/[bluebird]/js/release/promise.js:569:18 - promise.js:606 Promise._settlePromiseCtx [webpacklearn]/[bluebird]/js/release/promise.js:606:10 - async.js:138 Async._drainQueue [webpacklearn]/[bluebird]/js/release/async.js:138:12 - async.js:143 Async._drainQueues [webpacklearn]/[bluebird]/js/release/async.js:143:10 - async.js:17 Immediate.Async.drainQueues [webpacklearn]/[bluebird]/js/release/async.js:17:14 </pre>
是不是你的 index.html 文件里用 script 引用了 js？如果是，注释或删除后重新运行应该就好了~
必须删掉模板中script标签引入，注释都不好使
webpack模板中的注释也被视为模块，他需要保证注释的准确性，所以，如果在注释中引入的chunks中没有响应的内容，就会报错。
我的a.html是ok的，但是b，c都是不行，就是如此。
有可能是你配置文件里写了excludeChunks['main']，而你在html中写的是 compilation.assets[htmlWebpackPlugin.files.chunks.main.entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() 这样也会报错，与excludeChunks 冲突
确实 注释了script之后运行不成功 删掉script才可以
chunks:['main','b'] 必须引入main，我是因为b和c都没引入才报错的
你需要在b和c里也chunks:['b','main'] chunks:['c','main']
老师用的是excludeChunks，我用的是chunks，报错后的解决方法：在webpack.config.js中chunks:["b","main"]和chunks:["c","main"]都加上“main”就好了。得出的结论，模板html文件中如果有固定引入某个打包后的js文件，那么相应的调用模板文件的配置中就要在chunks中加入固定的js文件在entry中对应的key。如：
<%=
/*这里就引入了固定的main对应的打包后的js文件*/ compilation.assets[htmlWebpackPlugin.files.chunks.main.entry.substr(htmlWebpackPlugin.files.publicPath.length)].source()
%>
那么webpack.config.js中chunks:["b","main"]，就要写"main"，不然就报错误：
Cannot read property 'entry' of undefined
也有同样的疑问
好吧，虽然删除template中的script确实可以解决问题，但是如果确实需要在template中插入script标签呢，到底怎么破？望有人能解答一下这个问题
<script type="text/javascript">
<%=
compilation.assets[htmlWebpackPlugin.files.chunks.main.entry.substr(htmlWebpackPlugin.files.publicPath.length)].source()
%>
</script>
在head中插入这段代码也不会生成b.html和c.html怎么办
确实需要删除才可以
遇到同样的问题！如果 index.html引用了js，需要删除，注释掉没有用。
inject:'body'改成inject:false,不要自动向index.html中插入js,然后在b和c页面的的插件配置中,chunks要引入'main'，因为你的index.html有个直接引用的js，调用了 main.entry。然后加上excludeChunks:['a','c']和excludeChunks:['a','b'],排除掉不需要的chunk,就OK了