vue 插件HtmlWebpackPlugin最全参数详解

var htmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
    plugins: [
        new htmlWebpackPlugin({
            filename: 'index.html',
            template: 'index.html',
            inject: true
        })
    ]
}

title：生成html文件的标题

filename：html文件的文件名，默认是index.html

template：指定你生成的文件所依赖哪一个html文件模板，使用自定义的模板文件的时候，需要安装对应的loader

inject ：

true //默认值，script标签位于html文件的 body 底部
body //script标签位于html文件的 body 底部
head //script标签位于html文件的 head中
false //不插入生成的js文件，这个几乎不会用到的

favicon:html文件favicon

minify：minify会对生成的html文件进行压缩。默认是false，可以对minify进行配置

plugins: [
    new HtmlWebpackPlugin({
        minify: {
            removeAttributeQuotes: true // 移除属性的引号
        }
    })
]

cache：内容变化的时候生成一个新的文件

showErrors：webpack报错的时候，会把错误信息包裹再一个pre中，默认是true。

chunks：chunks主要用于多入口文件，当你有多个入口文件，那就回编译后生成多个打包后的文件，选择使用那些js文件，没有设置chunks选项，那么默认是全部显示(当配置vue开发多页面时，记得配置chunks，否则会有html引入不需要的js报错 [Vue warn]: Cannot find element:)

excludeChunks：不适用那些js

xhtml:默认值是 false ，如果为 true ,则以兼容 xhtml 的模式引用文件。

chunksSortMode

vue 插件HtmlWebpackPlugin最全参数详解

猜你喜欢