目的:
~~~
將不同路徑下的js文件 打包添加到 生成的html中
~~~
環境配置
1. 在webpack.config.js文件中復制添加內容
~~~
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: './src/index.js', //表示文件的入口
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js' //表示文件出口
},
//添加的html文件
plugins: [
new HtmlWebpackPlugin({
title:"打包文件",
//js插入的位置
inject:"head",
//生成的模板
template:"index.html",
//生成的html的文件夾名
//filename:'[hash]-index.html,
//date:new Date() 創建一個時間屬性 參看http://www.chengbenchao.top/webpack/710012
})
] ,
~~~
2. npm i html-webpack-plugin --save-dev
3. webpack
4. 在dist文件夾下生成index.html和bundle.js文件