vue 多页应用打包(使用html-webpack-plugin)

vue 多页应用打包(使用html-webpack-plugin)

安装

npm install --save-dev html-webpack-plugin

使用

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports ={
    
    
  entry: {
    
    
    index: './src/index.js',
    tod: './src/tod.js',
  },
  output: {
    
    
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].[hash:6].js',
  },
  plugins:[
     new HtmlWebpackPlugin({
    
    
      template: './public/index.html',
      filename: 'index.html', //打包后的文件名
      minify: {
    
    
        // 压缩HTML文件
        removeComments: true, // 移除HTML中的注释
        collapseWhitespace: true, // 删除空白符与换行符
        minifyCSS: true, // 压缩内联css
      },
      chunks: ['index'],
    }),
    new HtmlWebpackPlugin({
    
    
      template: './public/tod.html',
      filename: 'tod.html', //打包后的文件名
      minify: {
    
    
        // 压缩HTML文件
        removeComments: true, // 移除HTML中的注释
        collapseWhitespace: true, // 删除空白符与换行符
        minifyCSS: true, // 压缩内联css
      },
      chunks: ['tod'],
    }),
  ]
}