const { DefinePlugin } = require('webpack');
const TerserPlugin = require('terser-webpack-plugin');
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
const CompressionWebpackPlugin = require('compression-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://192.168.10.54:9100/v1',
        changeOrigin: true,
        pathRewrite: {
          '^/api': '',
        },
      },
    },
  },
  configureWebpack: {
    optimization: {
      minimizer: [
        new TerserPlugin({
          terserOptions: {
            compress: {
              drop_console: true, // 删除 console
            },
          },
        }),
        new CssMinimizerPlugin(),
      ],
      splitChunks: {
        chunks: 'all',
        maxInitialRequests: Infinity,
        minSize: 20000, // 生成块的最小大小
        maxSize: 500000, // 生成块的最大大小
        cacheGroups: {
          vendors: {
            test: /[\\/]node_modules[\\/]/,
            name(module) {
              const packageName = module.context.match(
                /[\\/]node_modules[\\/](.*?)([\\/]|$)/
              )[1];
              return `npm.${packageName.replace('@', '')}`;
            },
          },
        },
      },
      runtimeChunk: 'single',
    },
    plugins: [
      new CompressionWebpackPlugin({
        test: /\.(js|css|html|svg)$/, // 需要压缩的文件类型
        threshold: 10240, // 资源超过10KB时压缩
        deleteOriginalAssets: false, // 是否删除原始文件
      }),
      new BundleAnalyzerPlugin({
        analyzerMode: 'static', // 生成静态报告文件
        openAnalyzer: false, // 打包后是否自动打开报告
      }),
    ],
  },
  chainWebpack: config => {
    // config.plugin('define').use(DefinePlugin, [
    //   {
    //     'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
    //   },
    // ]);

    // config.module
    //   .rule('images')
    //   .use('url-loader')
    //   .loader('url-loader')
    //   .tap(options => ({
    //     limit: 8192, // 图片小于8KB时转换为base64
    //     fallback: {
    //       loader: 'file-loader',
    //       options: {
    //         name: 'img/[name].[hash:8].[ext]',
    //       },
    //     },
    //   }));
  },
};