本文介紹了webpack 插件html-webpack-plugin的具體使用，分享給大家，具體如下：
插件地址：https://www.npmjs.com/package/html-webpack-plugin
這個插件用來簡化創建服務于 webpack bundle 的 HTML 文件，尤其是對于在文件名中包含了 hash 值，而這個值在每次編譯的時候都發生變化的情況。你既可以讓這個插件來幫助你自動生成 HTML 文件，也可以使用 lodash 模板加載生成的 bundles，或者自己加載這些 bundles。
Installation
使用 npm 安裝這個插件
$ npm install html-webpack-plugin@2 --save-dev
Basic Usage
這個插件可以幫助生成 HTML 文件，在 body 元素中，使用 script 來包含所有你的 webpack bundles，只需要在你的 webpack 配置文件中如下配置：
var HtmlWebpackPlugin = require('html-webpack-plugin')var webpackConfig = { entry: 'index.js', output: { path: 'dist', filename: 'index_bundle.js' }, plugins: [new HtmlWebpackPlugin()]}這將會自動在 dist 目錄中生成一個名為 index.html 的文件，內容如下：
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>Webpack App</title> </head> <body> <script src="index_bundle.js"></script> </body></html>
如果你有多個 webpack 入口點，它們都會被包含在生成的 script 元素中。
如果有任何的 CSS 資源包含在 webpack 輸出中（例如，使用 ExtractTextPlugin 提煉出的 css ），這些將會使用 link 包含在 HTML 頁面的 head 元素中。
Configuration
可以進行一系列的配置，支持如下的配置信息
新聞熱點
疑難解答
圖片精選
