const AutoImport = require("unplugin-auto-import/webpack");
const Components = require("unplugin-vue-components/webpack");
const { ElementPlusResolver } = require("unplugin-vue-components/resolvers");

const isDev = process.env.NODE_ENV === "development";

module.exports = {
  publicPath: isDev ? "/" : "./",
  devServer: {
    port: process.env.VUE_APP_PORT || 8080,
    open: true,
  },
  chainWebpack: (config) => {
    /* 修改网页title 在.env文件中定义 */
    config.plugin("html").tap((args) => {
      args[0].title = process.env.VUE_APP_TITLE;
      return args;
    });
    /* 修改图片最小尺寸 */
    config.module
      .rule("images")
      .use("url-loader")
      .tap((options) => {
        options.limit = process.env.VUE_APP_FILE_LIMIT;
        return options;
      });
    /* 去除console */
    config.optimization.minimizer("terser").tap((options) => {
      options[0].terserOptions.compress.drop_console = true;
      return options;
    });
    return config;
  },
  configureWebpack: {
    plugins: [
      /* 自动引入ElementPlus组件 */
      AutoImport({
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
      /* -------------------- */
    ],
  },
};