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:
@@ -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: [
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user