import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
// 老浏览器支持
// @ts-ignore
import legacy from "@vitejs/plugin-legacy";
import Components from "unplugin-vue-components/vite";
import { VantResolver } from "unplugin-vue-components/resolvers";
import { resolve } from "path";
import { loadEnv } from "vite";
import postCssPxToRem from "postcss-pxtorem";

// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
  // Load env file based on `mode` in the current working directory.
  // Set the third parameter to '' to load all env regardless of the `VITE_` prefix.
  const env = loadEnv(mode, process.cwd(), "VITE_");
  // console.log(env)
  return {
    // vite config
    plugins: [
      vue(),
      Components({
        resolvers: [VantResolver()],
      }),
      legacy({
        // targets: ["defaults", "not IE 11"],
        targets: ["Ios 11", "Chrome 54"],
        modernPolyfills: true,
        additionalLegacyPolyfills: ["regenerator-runtime/runtime"],
        renderLegacyChunks: true,
        polyfills: [
          "es.symbol",
          "es.array.filter",
          "es.promise",
          "es.promise.finally",
          "es/map",
          "es/set",
          "es.array.for-each",
          "es.object.define-properties",
          "es.object.define-property",
          "es.object.get-own-property-descriptor",
          "es.object.get-own-property-descriptors",
          "es.object.keys",
          "es.object.to-string",
          "web.dom-collections.for-each",
          "esnext.global-this",
          "esnext.string.match-all",
        ],
      }),
    ],
    css: {
      preprocessorOptions: {
        scss: {
          additionalData: '@import "./src/styles/vars.scss";',
        },
      },
      postcss: {
        plugins: [
          postCssPxToRem({
            rootValue: 72,
            propList: ["*"],
          }),
        ],
      },
    },
    resolve: {
      alias: {
        "@": resolve(__dirname, "src"),
        "vue-i18n": "vue-i18n/dist/vue-i18n.cjs.js",
      },
    },
    server: (() => {
      const obj = {
        host: "0.0.0.0",
        port: 4200,
      };
      return obj;
    })(),
    base: "./",
    esbuild: {
      target: "es2015",
    },
    define: {
      __APP_ENV__: env,
    },
  };
});