处理类型

vite.config.ts

@@ -12,11 +12,31 @@ import Components from 'unplugin-vue-components/vite'
 // Element Plus 组件自动导入
 import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
 
+// 自定义插件：修复 face-api.js 模型文件的 MIME 类型
+function faceModelsMimeTypePlugin() {
+  return {
+    name: 'face-models-mime-type',
+    configureServer(server) {
+      server.middlewares.use((req, res, next) => {
+        const url = req.url || ''
+        if (url.includes('.shard1') || url.includes('.shard2')) {
+          res.setHeader('Content-Type', 'application/wasm')
+        } else if (url.includes('.weights_manifest.json')) {
+          res.setHeader('Content-Type', 'application/json')
+        }
+        next()
+      })
+    },
+  }
+}
+
 // https://vite.dev/config/
 export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
   const isProduction = mode === 'production'
   const env = loadEnv(mode, process.cwd())
   return {
+    // 解决 face-api.js 模型文件 MIME 类型问题
+    assetsInclude: ['**/*.shard1', '**/*.shard2', '**/*.weights_manifest.json'],
     esbuild: {
       drop: isProduction ? ['console', 'debugger'] : [],
       // minifyIdentifiers: true,
@@ -27,6 +47,8 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
       vue(),
       // 生产环境移除 devTools 插件（减少产物体积）
       ...(!isProduction ? [vueDevTools()] : []),
+      // face-api.js 模型文件 MIME 类型修复插件
+      faceModelsMimeTypePlugin(),
       AutoImport({
         resolvers: [ElementPlusResolver()],
         imports: ['vue', 'vue-router', 'pinia', '@vueuse/core'],