fix(nuxt): fall back to wasm if oxc native bindings are missing (#31190)

Author: danielroe

packages/nuxt/package.json

@@ -80,6 +80,7 @@
     "@nuxt/schema": "workspace:*",
     "@nuxt/telemetry": "^2.6.5",
     "@nuxt/vite-builder": "workspace:*",
+    "@oxc-parser/wasm": "^0.56.3",
     "@unhead/vue": "^2.0.0-rc.1",
     "@vue/shared": "^3.5.13",
     "c12": "^3.0.2",
@@ -111,7 +112,7 @@
     "ofetch": "^1.4.1",
     "ohash": "^2.0.11",
     "on-change": "^5.0.1",
-    "oxc-parser": "^0.56.0",
+    "oxc-parser": "^0.56.3",
     "pathe": "^2.0.3",
     "perfect-debounce": "^1.0.0",
     "pkg-types": "^2.1.0",

packages/nuxt/src/core/nuxt.ts

@@ -51,6 +51,7 @@ import { ResolveDeepImportsPlugin } from './plugins/resolve-deep-imports'
 import { ResolveExternalsPlugin } from './plugins/resolved-externals'
 import { PrehydrateTransformPlugin } from './plugins/prehydrate'
 import { VirtualFSPlugin } from './plugins/virtual'
+import { initParser } from './utils/parse'
 
 export function createNuxt (options: NuxtOptions): Nuxt {
   const hooks = createHooks<NuxtHooks>()
@@ -336,6 +337,8 @@ async function initNuxt (nuxt: Nuxt) {
     }
   }
 
+  await initParser()
+
   // Support Nuxt VFS
   addBuildPlugin(VirtualFSPlugin(nuxt, { mode: 'server' }), { client: false })
   addBuildPlugin(VirtualFSPlugin(nuxt, { mode: 'client', alias: { '#internal/nitro': join(nuxt.options.buildDir, 'nitro.client.mjs') } }), { server: false })

packages/nuxt/src/core/utils/parse.ts

@@ -1,7 +1,6 @@
 import { walk as _walk } from 'estree-walker'
 import type { Node, SyncHandler } from 'estree-walker'
 import type { ArrowFunctionExpression, CatchClause, FunctionDeclaration, FunctionExpression, Identifier, ImportDefaultSpecifier, ImportNamespaceSpecifier, ImportSpecifier, Program, VariableDeclaration } from 'estree'
-import { parseSync } from 'oxc-parser'
 import { type SameShape, type TransformOptions, type TransformResult, transform as esbuildTransform } from 'esbuild'
 import { tryUseNuxt } from '@nuxt/kit'
 
@@ -35,10 +34,25 @@ export function walk (ast: Program | Node, callback: Partial<WalkOptions>) {
   })
 }
 
+let parseSync: typeof import('oxc-parser').parseSync
+
+export async function initParser () {
+  try {
+    parseSync = await import('oxc-parser').then(r => r.parseSync)
+  } catch {
+    // this can fail on stackblitz so we fall back to wasm build
+    const { parseSync: wasmParse } = await import('@oxc-parser/wasm')
+    parseSync = (sourceFilename, code, options) => wasmParse(code, {
+      sourceFilename: sourceFilename.replace(/\?.*$/, '') + `.${options?.lang || 'ts'}`,
+      sourceType: 'module',
+    }) as any
+  }
+}
+
 export function parseAndWalk (code: string, sourceFilename: string, callback: WalkerCallback): Program
 export function parseAndWalk (code: string, sourceFilename: string, object: Partial<WalkOptions>): Program
 export function parseAndWalk (code: string, sourceFilename: string, callback: Partial<WalkOptions> | WalkerCallback) {
-  const lang = sourceFilename.match(/\.[cm]?([jt]sx?)$/)?.[1] as 'js' | 'ts' | 'jsx' | 'tsx' | undefined
+  const lang = sourceFilename.match(/\.[cm]?([jt]sx?)$/)?.[1] as 'js' | 'ts' | 'jsx' | 'tsx' | undefined || 'ts'
   const ast = parseSync(sourceFilename, code, { sourceType: 'module', lang })
   walk(ast.program as unknown as Program, typeof callback === 'function' ? { enter: callback } : callback)
   return ast.program as unknown as Program