chore(vite): replace vite-node with Vite's native RunnableDevEnvironment (#1717)

Co-authored-by: Tobbe Lundberg <tobbe@tlundberg.com>

Author: lisa-assistant

packages/cli/package.json

@@ -42,6 +42,7 @@
     "@cedarjs/structure": "workspace:*",
     "@cedarjs/telemetry": "workspace:*",
     "@cedarjs/utils": "workspace:*",
+    "@cedarjs/vite": "workspace:*",
     "@cedarjs/web-server": "workspace:*",
     "@listr2/prompt-adapter-enquirer": "4.2.1",
     "@opentelemetry/api": "1.9.0",
@@ -88,7 +89,6 @@
     "title-case": "3.0.3",
     "unionfs": "4.6.0",
     "uuid": "11.1.0",
-    "vite-node": "3.2.4",
     "yargs": "17.7.2"
   },
   "devDependencies": {

packages/cli/src/lib/exec.js

@@ -1,9 +1,7 @@
+import { existsSync } from 'node:fs'
 import path from 'node:path'
 
-import { createServer, version as viteVersion } from 'vite'
-import { ViteNodeRunner } from 'vite-node/client'
-import { ViteNodeServer } from 'vite-node/server'
-import { installSourcemapsSupport } from 'vite-node/source-map'
+import { createServer, isRunnableDevEnvironment } from 'vite'
 
 import { getPaths, importStatementPath } from '@cedarjs/project-config'
 import {
@@ -13,8 +11,27 @@ import {
   cedarSwapApolloProvider,
   cedarImportDirPlugin,
   cedarAutoImportsPlugin,
+  cedarCjsCompatPlugin,
 } from '@cedarjs/vite'
 
+// When the customResolver returns an id, that id is final — Vite won't try
+// alternative extensions on it. This helper resolves the actual file on disk,
+// handling both bare paths (src/lib/jobs) and .js/.jsx paths that map to .ts
+// files in a TypeScript project (e.g. db.js → db.ts).
+function resolveExtension(id) {
+  if (existsSync(id)) {
+    return id
+  }
+  // Strip .js/.jsx extension if present, then try TypeScript and JS extensions
+  const withoutExt = /\.jsx?$/.test(id) ? id.replace(/\.jsx?$/, '') : id
+  for (const ext of ['.ts', '.tsx', '.js', '.jsx']) {
+    if (existsSync(withoutExt + ext)) {
+      return withoutExt + ext
+    }
+  }
+  return id
+}
+
 export async function runScriptFunction({
   path: scriptPath,
   functionName,
@@ -28,10 +45,16 @@ export async function runScriptFunction({
   const server = await createServer({
     mode: 'production',
     optimizeDeps: {
-      // This is recommended in the vite-node readme
       noDiscovery: true,
       include: undefined,
     },
+    server: {
+      hmr: false,
+      watch: null,
+    },
+    environments: {
+      nodeRunnerEnv: {},
+    },
     resolve: {
       alias: [
         {
@@ -63,23 +86,18 @@ export async function runScriptFunction({
             // from scripts/ because it doesn't know what the src/ alias is.
             // So we have to tell it to use the correct path based on what file
             // is doing the importing.
-            // Also, to support both imports like 'src/lib/db.js' and
-            // 'src/lib/db' in ts files we need to have special treatment for
-            // the .js extension.
+            // Also, to support imports like 'src/lib/db.js' in TS projects
+            // where only a .ts file exists, we resolve the correct extension
+            // ourselves — the customResolver result is final and Vite won't
+            // try alternative extensions on it.
             if (importer.startsWith(apiImportBase)) {
               const apiImportSrc = importStatementPath(getPaths().api.src)
-              let resolvedId = id.replace('src', apiImportSrc)
-              if (importer.endsWith('.ts') || importer.endsWith('.tsx')) {
-                resolvedId = resolvedId.replace(/\.jsx?$/, '')
-              }
-              return { id: resolvedId }
+              const resolvedId = id.replace('src', apiImportSrc)
+              return { id: resolveExtension(resolvedId) }
             } else if (importer.startsWith(webImportBase)) {
               const webImportSrc = importStatementPath(getPaths().web.src)
-              let resolvedId = id.replace('src', webImportSrc)
-              if (importer.endsWith('.ts') || importer.endsWith('.tsx')) {
-                resolvedId = resolvedId.replace(/\.jsx?$/, '')
-              }
-              return { id: resolvedId }
+              const resolvedId = id.replace('src', webImportSrc)
+              return { id: resolveExtension(resolvedId) }
             }
 
             return null
@@ -88,6 +106,7 @@ export async function runScriptFunction({
       ],
     },
     plugins: [
+      cedarCjsCompatPlugin(),
       cedarjsResolveCedarStyleImportsPlugin(),
       cedarCellTransform(),
       cedarjsJobPathInjectorPlugin(),
@@ -97,49 +116,24 @@ export async function runScriptFunction({
     ],
   })
 
-  // For old Vite, this is needed to initialize the plugins.
-  if (Number(viteVersion.split('.')[0]) < 6) {
-    await server.pluginContainer.buildStart({})
+  const env = server.environments.nodeRunnerEnv
+  if (!env || !isRunnableDevEnvironment(env)) {
+    await server.close()
+    throw new Error('Vite environment is not runnable.')
   }
 
-  const node = new ViteNodeServer(server, {
-    transformMode: {
-      ssr: [/.*/],
-      web: [/\/web\//],
-    },
-    deps: {
-      fallbackCJS: true,
-    },
-  })
-
-  // fixes stacktraces in Errors
-  installSourcemapsSupport({
-    getSourceMap: (source) => node.getSourceMap(source),
-  })
-
-  const runner = new ViteNodeRunner({
-    root: server.config.root,
-    base: server.config.base,
-    fetchModule(id) {
-      return node.fetchModule(id)
-    },
-    resolveId(id, importer) {
-      return node.resolveId(id, importer)
-    },
-  })
-
   let returnValue
   let scriptError = null
 
   try {
-    const script = await runner.executeFile(scriptPath)
+    const script = await env.runner.import(scriptPath)
     returnValue = await script[functionName](args)
   } catch (error) {
     scriptError = error
   }
 
   try {
-    const { db } = await runner.executeFile(path.join(getPaths().api.lib, 'db'))
+    const { db } = await env.runner.import(path.join(getPaths().api.lib, 'db'))
     db.$disconnect()
   } catch (e) {
     // silence

packages/prerender/package.json

@@ -91,8 +91,7 @@
     "rollup-plugin-swc3": "0.12.1",
     "unimport": "5.7.0",
     "unplugin-auto-import": "19.3.0",
-    "vite": "7.3.2",
-    "vite-node": "3.2.4"
+    "vite": "7.3.2"
   },
   "devDependencies": {
     "@cedarjs/framework-tools": "workspace:*",

packages/prerender/src/graphql/node-runner.ts

@@ -1,15 +1,13 @@
-import { createServer, version as viteVersion, mergeConfig } from 'vite'
-import type { ViteDevServer, UserConfig } from 'vite'
-import { ViteNodeRunner } from 'vite-node/client'
-import { ViteNodeServer } from 'vite-node/server'
-import { installSourcemapsSupport } from 'vite-node/source-map'
+import { createServer, isRunnableDevEnvironment, mergeConfig } from 'vite'
+import type { ViteDevServer, RunnableDevEnvironment, UserConfig } from 'vite'
 
 import { getPaths } from '@cedarjs/project-config'
 import {
   cedarCellTransform,
   cedarjsResolveCedarStyleImportsPlugin,
   cedarjsJobPathInjectorPlugin,
   cedarSwapApolloProvider,
+  cedarCjsCompatPlugin,
 } from '@cedarjs/vite'
 
 import { cedarAutoImportsPlugin } from './vite-plugin-cedar-auto-import.js'
@@ -19,10 +17,16 @@ async function createViteServer(customConfig: UserConfig = {}) {
   const defaultConfig: UserConfig = {
     mode: 'production',
     optimizeDeps: {
-      // This is recommended in the vite-node readme
       noDiscovery: true,
       include: undefined,
     },
+    server: {
+      hmr: false,
+      watch: null,
+    },
+    environments: {
+      nodeRunnerEnv: {},
+    },
     resolve: {
       alias: [
         {
@@ -32,6 +36,7 @@ async function createViteServer(customConfig: UserConfig = {}) {
       ],
     },
     plugins: [
+      cedarCjsCompatPlugin(),
       cedarImportDirPlugin(),
       cedarAutoImportsPlugin(),
       cedarjsResolveCedarStyleImportsPlugin(),
@@ -45,17 +50,12 @@ async function createViteServer(customConfig: UserConfig = {}) {
 
   const server = await createServer(mergedConfig)
 
-  // For old Vite, this is needed to initialize the plugins.
-  if (Number(viteVersion.split('.')[0]) < 6) {
-    await server.pluginContainer.buildStart({})
-  }
-
   return server
 }
 
 export class NodeRunner {
   private viteServer?: ViteDevServer = undefined
-  private runner?: ViteNodeRunner = undefined
+  private env?: RunnableDevEnvironment = undefined
   private readonly customViteConfig: UserConfig
 
   constructor(customViteConfig: UserConfig = {}) {
@@ -64,39 +64,27 @@ export class NodeRunner {
 
   async init() {
     this.viteServer = await createViteServer(this.customViteConfig)
-    const nodeServer = new ViteNodeServer(this.viteServer, {
-      transformMode: {
-        ssr: [/.*/],
-        web: [/\/web\//],
-      },
-      deps: {
-        fallbackCJS: true,
-      },
-    })
 
-    // fixes stacktraces in Errors
-    installSourcemapsSupport({
-      getSourceMap: (source) => nodeServer?.getSourceMap(source),
-    })
+    const env = this.viteServer.environments.nodeRunnerEnv
+    if (!env || !isRunnableDevEnvironment(env)) {
+      await this.viteServer.close()
+      throw new Error('Vite environment is not runnable.')
+    }
 
-    this.runner = new ViteNodeRunner({
-      root: this.viteServer.config.root,
-      base: this.viteServer.config.base,
-      fetchModule(id) {
-        return nodeServer.fetchModule(id)
-      },
-      resolveId(id, importer) {
-        return nodeServer.resolveId(id, importer)
-      },
-    })
+    this.env = env
   }
 
   async importFile(filePath: string) {
-    if (!this.runner) {
+    if (!this.env) {
       await this.init()
     }
 
-    return this.runner?.executeFile(filePath)
+    const env = this.env
+    if (!env) {
+      throw new Error('NodeRunner failed to initialize')
+    }
+
+    return env.runner.import(filePath)
   }
 
   async close() {

packages/vite/package.json

@@ -87,6 +87,7 @@
     "@vitejs/plugin-react": "4.7.0",
     "@whatwg-node/fetch": "0.10.13",
     "@whatwg-node/server": "0.10.18",
+    "acorn": "8.16.0",
     "acorn-loose": "8.5.2",
     "ansis": "4.2.0",
     "buffer": "6.0.3",

packages/vite/src/index.ts

@@ -21,6 +21,7 @@ import { cedarMergedConfig } from './plugins/vite-plugin-merged-config.js'
 import { cedarSwapApolloProvider } from './plugins/vite-plugin-swap-apollo-provider.js'
 
 export { cedarAutoImportsPlugin } from './plugins/vite-plugin-cedar-auto-import.js'
+export { cedarCjsCompatPlugin } from './plugins/vite-plugin-cedar-cjs-compat.js'
 export { cedarCellTransform } from './plugins/vite-plugin-cedar-cell.js'
 export { cedarEntryInjectionPlugin } from './plugins/vite-plugin-cedar-entry-injection.js'
 export { cedarHtmlEnvPlugin } from './plugins/vite-plugin-cedar-html-env.js'