第四部分开始涉及到多页面的配置以及webpack plugin 中具体的参数。
1、首先涉及到多页面，我们在新建三个JS文件后可以进行如下设置。
（1）在entry 中增加JS文件的路径
（2）针对不同的页面可以new出多个 webpack plugin 对象
（3）对每个页面设置不同的文件名或者Title
（4）针对每一个页面引入不同的JS，通过使用'chunks[ ] '
（5）excludeChunks:['',''] ，表示排除数组内的JS，其他的JS都引用
const path = require('path');
var htmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
index
entry:{
main:'./src/script/main.js',
a:'./src/script/a.js', //（1）新建的JS
b:'./src/script/b.js', //（1）新建的JS
c:'./src/script/c.js' //（1）新建的JS
},
output:{
path:path.resolve(__dirname,'dist'),
filename:'js/[name].js',
publicPath:'https://cdn.com/'
},
plugins:[
new htmlWebpackPlugin({
filename:'a.html',
template:'index.html',
inject:'body',
title:'This is a',
//chunks:['main','a']
excludeChunks:['b','c']
}),
new htmlWebpackPlugin({
filename:'b.html',
template:'index.html',
inject:'body',
title:'This is b',
chunks:['b']
}),
new htmlWebpackPlugin({
filename:'c.html',
template:'index.html',
inject:'body',
title:'This is c',
chunks:['c']
})
]
}
2、引用，通过webpack流处理过的文件目的是：【把页面src引入文件的方式，改成用script标签嵌入的方式，减少http请求( 提高加载性能）】.通过模板文件的写法，在其中编写如下代码，将会得到通过Webpack流处理的JS文件,或者参考如下链接的文章，
使用html-webpack-inline-source-plugin
html-webpack-inline-source-plugin GitHub 地址
<html>
<head>
<meta charset="utf-8">
<title><%= htmlWebpackPlugin.options.title %></title>
<script type="text/javascript">
<%= compilation.assets[htmlWebpackPlugin.files.chunks.main.entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
</script>
</head>
<body>
<p>Hello World</p>
<p>Hello YYY</p>
</body>
</html>
