CamTalk/frontend/vite.config.ts

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import fs from 'fs'
import path from 'path'

const ortDistDir = path.resolve(__dirname, 'node_modules/onnxruntime-web/dist')
const vadDistDir = path.resolve(__dirname, 'node_modules/@ricky0123/vad-web/dist')
const publicDir = path.resolve(__dirname, 'public')

// 需要复制到 public 的静态资源
const staticFiles = [
  { src: vadDistDir, name: 'silero_vad_legacy.onnx' },
  { src: vadDistDir, name: 'silero_vad_v5.onnx' },
  { src: vadDistDir, name: 'vad.worklet.bundle.min.js' },
]

export default defineConfig({
  server: {
    proxy: {
      '/ws': {
        target: 'http://localhost:8080',
        ws: true,
      },
      '/api': {
        target: 'http://localhost:8080',
      },
    },
  },
  plugins: [
    react(),
    {
      name: 'serve-vad-assets',
      // 1. 启动时将 VAD 模型/工作线程复制到 public
      configResolved() {
        for (const { src, name } of staticFiles) {
          const dest = path.join(publicDir, name)
          if (!fs.existsSync(dest)) {
            fs.copyFileSync(path.join(src, name), dest)
          }
        }
      },
      // 2. 中间件拦截所有 WASM 相关请求，从原始路径提供文件
      configureServer(server) {
        server.middlewares.use((req, res, next) => {
          const url = req.url?.split('?')[0] ?? ''
          // 匹配任意路径下的 ort-wasm 文件（包括 .vite/deps/ 和根路径）
          const wasmMatch = url.match(/\/(ort-wasm-simd-threaded\.(mjs|wasm))$/)
          if (wasmMatch) {
            const fileName = wasmMatch[1]
            const filePath = path.join(ortDistDir, fileName)
            if (fs.existsSync(filePath)) {
              res.setHeader('Content-Type', fileName.endsWith('.wasm') ? 'application/wasm' : 'application/javascript')
              res.setHeader('Cache-Control', 'no-cache')
              res.end(fs.readFileSync(filePath))
              return
            }
          }
          next()
        })
      },
    },
  ],
})