import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "node:path";
import { createHtmlPlugin } from 'vite-plugin-html';  
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
import { version } from './package.json'

// https://vite.dev/config/
export default ({ mode }: any) => {
	const env = loadEnv(mode, process.cwd())

  let proxy
  if (mode === 'development') {
    const apiEnv = loadEnv(env.VITE_TARGET, process.cwd())
    const getProxy = (prev: string, api: string) => ({
      target: api,
      changeOrigin: true,
      rewrite: (path: any) => path.replace(prev, '')
    })

    proxy = {
      [env.VITE_MESH_OSS_URL]: getProxy(env.VITE_MESH_OSS_URL, apiEnv.VITE_MESH_OSS_URL),
      [env.VITE_MESH_API_URL]: getProxy(env.VITE_MESH_API_URL, apiEnv.VITE_MESH_API_URL),
      [env.VITE_CLOUD_API_URL]: getProxy(env.VITE_CLOUD_API_URL, apiEnv.VITE_CLOUD_API_URL),
      [env.VITE_FUSE_API_URL]: getProxy(env.VITE_FUSE_API_URL, apiEnv.VITE_FUSE_API_URL),
    }
    console.log(proxy)
  }

  return defineConfig({
    resolve: {
      alias: {
        "@/": `${path.resolve(__dirname, "src")}/`,
      },
    },
    css: {
      preprocessorOptions: {
        scss: {
          quietDeps: true,
          additionalData: `
						@forward 'element-plus/theme-chalk/src/common/var' with (
							$colors: (
								'primary': (
									'base': ${env.VITE_PRIMARY},
								),
							),
						);
					`,
        },
      },
    },
    server: {
      port: 9010,
      open: true,
      host: "0.0.0.0",
      proxy: proxy,
    },
    plugins: [
      createSvgIconsPlugin({
        iconDirs: [path.resolve(process.cwd(), 'public/icons')],
        symbolId: 'icon-[dir]-[name]'
      }),
      createHtmlPlugin({  
        template: 'index.html',
        entry: env.VITE_ENTRY,
        inject: {
          data: {
            title: env.VITE_TITLE,
          },
        }
      }),  
      vue()
    ],
    define: {
      __VERSION__: JSON.stringify(version)
    }
  });
};