const CompressionPlugin = require("compression-webpack-plugin");
const path = require("path");
const { VueLoaderPlugin } = require("vue-loader");
const TerserPlugin = require("terser-webpack-plugin");
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");

module.exports = {
  mode: 'production', // 生产模式,会开启 tree-shaking 和 压缩代码，以及其他优化
  entry: { // 后续需要上传哪个组件单独配置入口，其余注释
    list: '@/views/templates/cmsList/index.ts',
    detail: '@/views/templates/cmsDetail/index.ts',
    // ...
  },
  output: {
    path: path.join(__dirname, '../dist'),
    filename: '[name]/[name]_com.[chunkhash:8].chunk.js',
    library: {
      name: 'TempCom',
      type: 'umd', // 使用 UMD 模式以支持多种引入方式
    },
    publicPath: '/',
    clean: true,
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        exclude: /node_modules/,
        use: ['thread-loader', 'vue-loader'],
      },
      {
        test: /\.(js|ts)$/,
        exclude: /node_modules/,
        use: ['thread-loader', 'babel-loader'],
      },
      {
        test: /\.css$/,
        use: ['vue-style-loader', 'css-loader'],
      },
      {
        test: /\.scss$/,
        use: ['vue-style-loader', 'css-loader', 'sass-loader']
      }
    ]
  },
  plugins: [
    new VueLoaderPlugin(), // vue-loader 插件
    // 使用 CompressionPlugin 压缩静态资源
    // new CompressionPlugin({
    //   algorithm: 'gzip', // 指定压缩算法
    //   test: /\.js(\?.*)?$/i, // 正则匹配需要压缩的文件
    //   threshold: 10240, // 对超过10k的数据进行压缩
    //   minRatio: 0.8, // 压缩比例
    //   deleteOriginalAssets: false, // 是否删除原文件
    // }),
  ],
  optimization: {
    minimize: true,
    minimizer: [
      new TerserPlugin({
        terserOptions: {
          compress: {
            // drop_console: true, // 移除所有的`console`语句
          },
          output: {
            comments: false, // 去掉注释
          },
        },
        extractComments: false, // 不从代码中提取注释
      }),
      new CssMinimizerPlugin(),
    ],
  },
  resolve: {
    // 如果用的是pnpm 就暂时不要配置这个，会有幽灵依赖的问题，访问不到很多模块
    // 查找第三方模块只在本项目的node_modules中查找
    modules: [path.resolve(__dirname, '../node_modules')],
    extensions: ['.vue', '.ts', '.js', '.json'],
    alias: {
      '@': path.join(__dirname, '../src')
    }
  },
  cache: {
    type: 'filesystem', // 使用文件缓存
  },
}