webpack——entry，output，html-webpack-plugin简单配置

Entry配置

entry可定义为一个String或Array["string"],或一个对象。
多页面entry配置方式：分别给page1和page2分配chunk "page1","page2"

配置如下：

输出如下：

Ouput配置

1. output.filename

   不需要设置绝对路径 因为path会指定路径，如果entry为单一入口及一个字符串，output.filename也为字符串，如果entry为多个入口（对象的形式）output.filename也设置为字符串，则这个生成的filename文件会被覆盖，多个入口时应用占位符设置filename为可变的值。

   [name]为打包的文件名，[hash]为打包的hash值
   

   输出如下：
   

   [chunkhash]为每个chunk的hash值。每次文件改变的时候hash值才会变化。相当于文件的版本号的形式。
   将js放置于相对路劲目录下。
   

2. path:输出目录
3. publicath:生产环境地址，线上地址

   

html-webpack-plugin配置

一、单页面生成

1. 在webpack.config.js中引入插件

   

2. 新建模板文件如下：
   

3. 在webpack.config.js中设置参数plugins:

   filename:生成的html名字，template:模板文件，inject:注入的wei'zhi（head，body,false）,minify:压缩文件的参数

   

4. 输出如下：

   

二、多页面生成

1. html模板：compilation.assets[].source()inline的形式插入js内容，htmlWebPackPLugin.files.chunks为webpack中设置的参数。

   

2. webpack设置：参数：excludeChunks:[]排除这几个chunk,chunks:[],需要包含的几个chunk。