import { fileURLToPath, URL } from 'node:url'

import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import viteCompression from 'vite-plugin-compression'
import UnoCSS from 'unocss/vite'
// https://vitejs.dev/config/
export default ({mode}:{mode:string})=>{
  // 在vite.config.ts中使用环境变量
  console.log('mode',loadEnv(mode, process.cwd()).VITE_BASE_URL)
  return defineConfig({
    plugins: [
      vue(),
      vueJsx(),
      UnoCSS(),
      AutoImport({
        include: [
          /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
          /\.vue$/,
          /\.vue\?vue/, // .vue
          /\.md$/ // .md
        ],
        imports: ['vue', 'vue-router','pinia',{
          '@/hooks/web/useI18n': ['useI18n'],
        }],
        dts: 'src/types/auto-components.d.ts',
        resolvers: [ElementPlusResolver()]
      }),
      Components({
        resolvers: [ElementPlusResolver()],
        dirs: ['src/components','packages/components','components'],
        dts: 'src/types/components.d.ts',
      }),
      { //.gz
        ...viteCompression(),
        apply: 'build',
      }

    ],
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url)),
        'types': fileURLToPath(new URL('./types', import.meta.url))
      }
    },
    css:{
      preprocessorOptions: {
        scss: {
          additionalData: `@use "@/styles/variables.scss" as *;`
        },
      },
    },
    server:{
      host: '0.0.0.0',
      port: 10001,
      open: true,
      proxy: {
        '/api': {
          target: '要代理的地址',
          changeOrigin: true,
          ws: true,
          rewrite: (path: string) => path.replace(/^\/api/, ''),
        },
      },
    },
    build:{
      rollupOptions:{
        output:{
          // 通过() => import()形式加载的组件会自动分包，第三方插件需手动分包
          manualChunks: {
            vue: ['vue', 'vue-router', 'pinia'],
            elementIcons: ['@element-plus/icons-vue'],
          },
          // js和css文件夹分离
          chunkFileNames: "static/js/[name]-[hash].js",
          entryFileNames: "static/js/[name]-[hash].js",
          assetFileNames: "static/[ext]/[name]-[hash].[ext]",

        }
      }
    }
  })

}