// vite.config.js
export default {
  optimizeDeps: {
    // 强制预构建：动态 import、CJS-only 依赖建议显式声明，减少二次预构建
    include: ['lodash-es', 'axios', 'dayjs/locale/zh-cn'],
    // 排除 CJS 互操作有问题的包，改用浏览器原生加载
    exclude: ['@lit'],
  },
}

// 纯 JS 模块手动声明 HMR 边界（框架组件由插件自动生成）
import { createChart } from './chart'

export let chart = createChart(document.getElementById('app'))

if (import.meta.hot) {
  import.meta.hot.accept((newModule) => {
    // 用新模块重建，避免整页刷新
    chart.dispose()
    chart = newModule.createChart(document.getElementById('app'))
  })
  import.meta.hot.dispose(() => chart.dispose())
}

// vite.config.js —— 生产构建核心配置
import { defineConfig } from 'vite'
import { visualizer } from 'rollup-plugin-visualizer'

export default defineConfig({
  build: {
    target: 'es2020',            // 现代语法目标，少转译、产物更小
    cssCodeSplit: true,          // CSS 按入口拆分
    assetsInlineLimit: 4096,     // 4KB 以下资源内联为 data URL
    sourcemap: false,            // 生产按需开启
    rollupOptions: {
      output: {
        // 手动分块：把大而稳定的依赖单独拆出，业务迭代不影响其缓存
        manualChunks: {
          'vendor-vue': ['vue', 'vue-router', 'pinia'],
          'vendor-echarts': ['echarts'],
        },
        // 入口文件名带哈希，利于长缓存
        entryFileNames: 'assets/[name]-[hash].js',
        chunkFileNames: 'assets/[name]-[hash].js',
      },
    },
  },
  plugins: [
    // 构建产物分析：生成 stats.html，找出体积大头
    visualizer({ filename: 'dist/stats.html', gzipSize: true }),
  ],
})

// plugins/virtual-build-info.js
export default function buildInfo() {
  const virtualModuleId = 'virtual:build-info'
  const resolvedId = '\0' + virtualModuleId

  return {
    name: 'virtual-build-info',
    resolveId(id) {
      if (id === virtualModuleId) return resolvedId
    },
    load(id) {
      if (id === resolvedId) {
        // 以 \0 开头的模块不会被其他插件误处理
        return `export const buildTime = ${JSON.stringify(new Date().toISOString())}`
      }
    },
  }
}

// 业务代码中直接使用
import { buildTime } from 'virtual:build-info'
console.log('构建于', buildTime)

.env                # 所有模式加载
.env.development    # dev 模式
.env.production     # build 模式
.env.local          # 本地覆盖，默认被 git 忽略

// 只有 VITE_ 前缀的变量会暴露给客户端代码
console.log(import.meta.env.VITE_API_BASE)
console.log(import.meta.env.MODE, import.meta.env.PROD)

// 路由级代码分割：首屏只加载登录/首页，其余按需
const routes = [
  { path: '/login', component: () => import('./views/Login.vue') },
  { path: '/dashboard', component: () => import('./views/Dashboard.vue') },
  { path: '/report', component: () => import('./views/Report.vue') },
]