const path = require("path");
const webpack = require("webpack");
const IS_PROD = ["production", "prod"].includes(process.env.NODE_ENV);
// const CompressionPlugin = require("compression-webpack-plugin"); v5.0.0需要指定版本
const resolve = (dir) => path.join(__dirname, dir);

module.exports = {
  publicPath: "/static",
  productionSourceMap: false,
  css: {
    extract: IS_PROD, // 注释css热更新
    sourceMap: false,
    loaderOptions: {
      // scss: {
      //   // ⚠️注意：分号不能少
      //   prependData: `
			// 	@import "@assets/css/var.scss";
			// 	@import "@assets/css/mixins.scss";
			// 	@import "@assets/css/function.scss";
			// 	$src: "${process.env.VUE_APP_OSS_SRC}";
			// 	`,
      // },
      postcss: {
        plugins: [
          // require("postcss-px2rem")({
          //   remUnit: 37.5,
          // }),
        ],
      },
    },
  },
  configureWebpack: (config) => {
    /**
     * 引入cdn资源
     */
    // config.externals = {
    //   vue: "Vue",
    // };
  },
  chainWebpack: (config) => {
    /**
     * 引入cdn资源
     */
    const cdn = {
      css: [
        // "https://fonts.googleapis.com/css?family=Nunito:300,300i,400,600,800",
        
      ],
      js: [
        // "//cdn.jsdelivr.net/npm/vconsole@3.4.0/dist/vconsole.min.js"
      ],
    };
    config.plugin("html").tap((args) => {
      args[0].cdn = cdn;

      // 修复 Lazy loading routes Error
      args[0].chunksSortMode = "none";
      return args;
    });
    /**
     * 添加别名alias
     */
    config.resolve.alias
      .set("@", resolve("src"))
      .set("@assets", resolve("src/assets"));
    /**
     * 修复HMR（热更新）失效
     */
    config.resolve.symlinks(true);
    /**
     * 生产环境开启压缩
     */
    // 生产环境，开启js\css压缩
    // if(IS_PROD) {
    //     config.plugin('compressionPlugin').use(new CompressionPlugin({
    //         test: /\.(js|css|scss)$/, // 匹配文件名
    //         threshold: 10240, // 对超过10k的数据压缩
    //         minRatio: 0.8,
    //         deleteOriginalAssets: true // 删除源文件
    //     }))
    // }
    /**
     * 删除moment语言包
     */
    config
      .plugin("ignore")
      .use(
        new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /zh-cn$/)
      );
  },
  devServer: {
    open: true,
  },
};