fix: serve VAD assets from node_modules in dev mode

vite-plugin-static-copy only copies files at build time; in dev the /vad/
requests fell through to the SPA 404 handler, returning text/html which
caused the WASM magic-number validation error. Add a configureServer
middleware that serves the worklet bundle, ONNX model, and WASM files
directly from node_modules with correct MIME types during development.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
mk
2026-03-23 23:50:55 -03:00
parent 4a58277090
commit 1ffee2d25e

View File

@@ -22,6 +22,7 @@ import { sentryVitePlugin } from "@sentry/vite-plugin";
import react from "@vitejs/plugin-react";
import { realpathSync } from "fs";
import * as fs from "node:fs";
import * as path from "node:path";
// https://vitejs.dev/config/
// Modified type helper from defineConfig to allow for packageType (see defineConfig from vite)
@@ -35,7 +36,39 @@ export default ({
// In future we might be able to do what is needed via code splitting at
// build time.
process.env.VITE_PACKAGE = packageType ?? "full";
// Serve VAD assets (ONNX model, WASM, worklet bundle) from node_modules
// during dev. vite-plugin-static-copy only runs during build.
const serveVadAssets: PluginOption = {
name: "serve-vad-assets",
configureServer(server) {
const mimeTypes: Record<string, string> = {
".wasm": "application/wasm",
".onnx": "application/octet-stream",
".js": "application/javascript",
".mjs": "application/javascript",
};
const sourceDirs = [
path.join(process.cwd(), "node_modules/@ricky0123/vad-web/dist"),
path.join(process.cwd(), "node_modules/onnxruntime-web/dist"),
];
server.middlewares.use("/vad", (req, res, next) => {
const filename = (req.url ?? "/").replace(/^\//, "").split("?")[0];
for (const dir of sourceDirs) {
const filePath = path.join(dir, filename);
if (fs.existsSync(filePath)) {
const mime = mimeTypes[path.extname(filePath)] ?? "application/octet-stream";
res.setHeader("Content-Type", mime);
fs.createReadStream(filePath).pipe(res);
return;
}
}
next();
});
},
};
const plugins: PluginOption[] = [
serveVadAssets,
viteStaticCopy({
targets: [
{