1.HtmlWebpackPlugin
使用HtmlWebpackPlugin兩大作用：
1為html文件中引入的外部資源如script、link動(dòng)態(tài)添加每次compile后的hash，防止引用緩存的外部文件問(wèn)題
2可以生成創(chuàng)建html入口文件，比如單頁(yè)面可以生成一個(gè)html文件入口，配置N個(gè)html-webpack-plugin可以生成N個(gè)頁(yè)面入口
2.插件原理
將 webpack中`entry`配置的相關(guān)入口thunk? 和`extract-text-webpack-plugin`抽取的css樣式? 插入到該插件提供的`template`或者`templateContent`配置項(xiàng)指定的內(nèi)容基礎(chǔ)上生成一個(gè)html文件，具體插入方式是將樣式`link`插入到`head`元素中，`script`插入到`head`或者`body`中。
3.插件使用
varHtmlWebpackPlugin=require('html-webpack-plugin')
webpackconfig={
? ? ...
? ? plugins:[newHtmlWebpackPlugin( { } )]
}
4.配置參數(shù)詳解
title:? 生成html文檔標(biāo)題
filename: 輸出文件的名字
template: 本地模版的位置
inject:向template或者templateContent中注入所有靜態(tài)資源，不同的配置值注入的位置不經(jīng)相同。
1、true或者body：所有JavaScript資源插入到body元素的底部
2、head: 所有JavaScript資源插入到head元素中
3、false： 所有靜態(tài)資源css和JavaScript都不會(huì)注入到模板文件中
favicon：添加特定favicon路徑到輸出的html文檔中，這個(gè)同title配置項(xiàng)，需要在模板中動(dòng)態(tài)獲取其路徑值
hash:?true|false是否為靜態(tài)資源生成唯一hash值
chuck: ?允許插入到模板中的一些chunk，不配置此項(xiàng)默認(rèn)會(huì)將entry中所有的thunk注入到模板中。在配置多個(gè)頁(yè)面時(shí)，每個(gè)頁(yè)面注入的thunk應(yīng)該是不相同的，需要通過(guò)該配置為不同頁(yè)面注入不同的thunk；
excludeChunks: 這個(gè)與chunks配置項(xiàng)正好相反，用來(lái)配置不允許注入的thunk。
