uniapp vue.config.js配置chunk-vendors.js文件拆分

发布时间 2023-06-14 21:10:51作者: zhouyia~
const path = require('path')
function resolve(dir) {
  return path.join(__dirname, dir);
}
const CompressionPlugin = require('compression-webpack-plugin')
const htmlWebpackPlugin = require('html-webpack-plugin')
htmlWebpackPlugin.prototype.filterChunks = (chunks, includedChunks, excludedChunks) => {
  return chunks.filter(chunk => {
    let chunkName = chunk.names[0];
    // This chunk doesn't have a name. This script can't handled it.
    if (chunkName === undefined) {
      return false;
    }
    let idx = chunkName.indexOf('~')
    if (idx > -1) {
      chunkName = chunkName.substr(0, idx)
    }
    console.log('Chunks ', chunkName);
    // Skip if the chunk should be lazy loaded
    if (typeof chunk.isInitial === 'function') {
      if (!chunk.isInitial()) {
        return false;
      }
    } else if (!chunk.initial) {
      return false;
    }
    // Skip if the chunks should be filtered and the given chunk was not added explicity
    if (Array.isArray(includedChunks) && includedChunks.indexOf(chunkName) === -1) {
      return false;
    }
    // Skip if the chunks should be filtered and the given chunk was excluded explicity
    if (Array.isArray(excludedChunks) && excludedChunks.indexOf(chunkName) !== -1) {
      return false;
    }
    // Add otherwise
    return true;
  });
}
module.exports = {
  configureWebpack: {
    plugins: [
        new CompressionPlugin({
            algorithm: 'gzip', // 使用gzip压缩
            test: /\.js$|\.css$|\.html$|\.flag$/, // 匹配文件名
            filename: '[path][base].gz', // 压缩后的文件名(保持原文件名,后缀加.gz)
            minRatio: 0.8, // 压缩率小于0.8才会压缩
            threshold: 10240, // 对超过10k的数据压缩
            deleteOriginalAssets: false // 是否删除未压缩的源文件,谨慎设置,如果希望提供非gzip的资源,可不设置或者设置为false(比如删除打包后的gz后还可以加载到原始资源文件)
          })
    ],
    output: {
      filename: 'static/js/[name].js?hash=[hash:8].flag',
      chunkFilename: 'static/js/[name].js?hash=[hash:8].flag'
    },
    optimization: {
      splitChunks: {
        minSize: 10000,
        maxSize: 400000,
        chunks: 'all',
        name: true,
        cacheGroups: {
          vendors: {//key 为entry中定义的 入口名称
            test: /[\\/]node_modules[\\/]/,
            priority: -10//优先级
          },
          default: {
            minChunks: 2,
            priority: -20,
            reuseExistingChunk: true//复用之前的打包模块
          }
        }
      }
    }
  }
}