import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import Components from 'unplugin-vue-components/vite'
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'

export default defineConfig(({ mode }) => {
  const isProduction = mode === 'production'
  return {
    // 根据环境设置不同的base路径
    // 开发环境使用根路径'/'，方便本地开发访问
    // 生产环境使用'/overseas-mall/'，与nginx配置匹配
    base: isProduction ? '/overseas-mall/' : '/',
    plugins: [
      vue(),
      Components({
        resolvers: [
          AntDesignVueResolver({
            importStyle: false, // css in js
          })
        ],
      })
    ],
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src')
      }
    },
    css: {
      preprocessorOptions: {
        less: {
          math: 'always',
          globalVars: {},
          modifyVars: {
            'hack': 'true; @import "@/styles/variables.less";'
          }
        }
      }
    },
    server: {
      port: 8088,
      open: true,
      proxy: {
        // '/api': {
        //   target: 'https://jiasm.zfire.top/overseas-miniapp',
        //   ws: true,
        //   changeOrigin: true,
        //   rewrite: (path) => path.replace(/^\/api/, '')
        // }
      }
    },
    build: {
      outDir: 'dist',
      assetsDir: 'assets',
      rollupOptions: {
        output: {
          // 确保资源路径正确
          chunkFileNames: 'assets/[name]-[hash].js',
          entryFileNames: 'assets/[name]-[hash].js',
          assetFileNames: 'assets/[name]-[hash].[ext]'
        }
      }
    }
  }
})