high-score-visualization/vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import qiankun from 'vite-plugin-qiankun'
import { resolve } from 'path'
import Components from 'unplugin-vue-components/vite'
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers';
export default defineConfig({
  plugins: [
    vue(),
    qiankun('high-score-visualization', { // 子应用名称，与主应用注册时一致
      useDevMode: true
    }),
    Components({
      resolvers: [
          AntDesignVueResolver({
              importStyle: false, // css in js
          }),
      ],
      // 指定自定义组件位置(默认:src/components)
      dirs: ['src/components', 'src/**/components'],
      // 导入组件类型声明文件路径 (false:关闭自动生成)
      // dts: false,
      dts: 'types/components.d.ts',
  }),
    
  ],
  build: {
    rollupOptions: {
      output: {
        // 自定义打包后的文件名
        chunkFileNames: 'assets/js/[name]-[hash].js',
        entryFileNames: 'assets/js/[name]-[hash].js',
        
        // 确保Vue组件不会被当作入口点
        manualChunks(id) {
          if (id.includes('node_modules')) {
            return 'vendor'
          }
        }
      }
    }
  },
  server: {
    port: 7101, // 指定子应用端口
    cors: true,
    origin: 'http://localhost:7101' // 确保端口与主应用配置一致
  },
  resolve: {
    alias: {
      '@': resolve(__dirname, './src')
    }
  },
  base: process.env.NODE_ENV === 'production' ? '/high-score-visualization/' : '/'
})