(精华)2020年7月10日 webpack html文件的编译

var htmlWebpackPlugin = require('html-webpack-plugin');

// 声明/dist的路径 为成绝对路径
module.exports = {
  // 模块解析 
  module: {},
  // 插件
  plugins: [
    new htmlWebpackPlugin({
      filename: path.resolve(DIST_PATH, 'index.html'), //就是 html 文件的文件名，默认是index.html 
      title: '标题',
      template: path.resolve(__dirname, 'index.html'), //指定你生成的文件所依赖哪一个 html文件模板，模板类型可以是 html、jade、ejs等 
      inject: true, //true body head false true 默认值，script标签位于 html 文件的 body 底部 body script标签位于 html 文件的 body 底部 head script标签位于 html 文件的 head 中 false 不插入生成的 js文件，这个几乎不会用到的 
      hash: true,
      favicon: path.resolve(__dirname, './fav.ico'), //给你生成的html 文件生成一个 favicon ,值是一个路径 //然后再生成的 html中就有了一个 link 标签 <link rel="shortcut icon" href="example.ico">
      minify: true, //是否对HTML进行压缩 
      cache:true, //默认是 true的，表示内容变化的时候生成一个新的文件 
      showErrors:true, //当webpack报错的时候，会把错误信息包裹再一个pre中，默认是true 
      chunks:chunks, //chunks 主要用于多入口文件，当你有多个入口文件，那就回编译后生成多个打包后的文件，那么 chunks 就能选择你要使用那些 js 文件 ， 
      excludeChunks: '',//排除掉一些js 
    })
  ],
}

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
 

文章来源: codeboy.blog.csdn.net，作者：愚公搬代码，版权归原作者所有，如需转载，请联系作者。

原文链接：codeboy.blog.csdn.net/article/details/107272361