欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-06-22 17:14:11
var htmlWebpackPlugin = require('html-webpack-plugin');// 声明/dist的路径 为成绝对路径module.exports = { // 模块解析 module: {}, // 插件 plugins: [ new htmlWebpackPlugin({ filename: path.resolve(DIST_PATH, 'index.html'), //就是 html 文件的文件名,默认是index.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 
    })
  ],
}

本文地址:https://blog.csdn.net/aa2528877987/article/details/107272361