@vxrn/compiler 1.10.6 → 1.11.0

package/src/constants.ts

@@ -1,5 +1,3 @@
-import type { ParserConfig } from '@swc/core'
-
 import { createDebugger } from '@vxrn/utils'
 
 export const { debug } = createDebugger('vxrn:compiler-plugin')
@@ -8,7 +6,8 @@ export const runtimePublicPath = '/@react-refresh'
 
 export const asyncGeneratorRegex = /(async \*|async function\*|for await)/
 
-export const parsers: Record<string, ParserConfig> = {
+// parser configs for swc (used by transformSWC consumers)
+export const parsers: Record<string, any> = {
   '.tsx': { syntax: 'typescript', tsx: true, decorators: true },
   '.ts': { syntax: 'typescript', tsx: false, decorators: true },
   '.jsx': {

package/src/index.ts

@@ -1,6 +1,7 @@
 /**
- * Adapted from https://github.com/vitejs/vite-plugin-react-swc/blob/main/src/index.ts
- * to work on both native and web, and with reanimated and other babel fallbacks
+ * Compiler plugin for One/VXRN
+ * Automates babel transforms (react compiler, codegen, user transforms) and
+ * react native CSS-to-JS conversion.
  */
 
 import { readFileSync } from 'node:fs'
@@ -9,12 +10,11 @@ import { dirname, extname, join, relative, sep } from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { resolvePath } from '@vxrn/utils'
 import { cssToReactNativeRuntime } from 'react-native-css-interop/css-to-rn/index.js'
-import type { OutputChunk } from 'rollup'
+import type { OutputChunk } from 'rolldown'
 import type { PluginOption, ResolvedConfig, UserConfig } from 'vite'
 import { configuration } from './configure'
 import { debug, runtimePublicPath, validParsers } from './constants'
 import { getBabelOptions, transformBabel } from './transformBabel'
-import { transformSWC } from './transformSWC'
 import type { Environment, GetTransformProps, Options } from './types'
 import { getCachedTransform, logCacheStats, setCachedTransform } from './cache'
 
@@ -107,9 +107,7 @@ async function performBabelTransform({
     return null
   }
 
-  const isPreProcess = id.startsWith(`vxrn-swc-preprocess:`)
-
-  if (!isPreProcess && userTransform !== 'swc') {
+  if (userTransform !== 'swc') {
     const babelOptions = getBabelOptions({
       ...transformProps,
       userSetting: userTransform,
@@ -170,108 +168,6 @@ async function performBabelTransform({
   return null
 }
 
-// Full transform (Babel + SWC) for Vite transform hook
-async function performFullTransform({
-  codeIn,
-  _id,
-  environment,
-  production,
-  reactForRNVersion,
-  optionsIn,
-  mode,
-}: {
-  codeIn: string
-  _id: string
-  environment: Environment
-  production: boolean
-  reactForRNVersion: '18' | '19'
-  optionsIn?: Partial<Options>
-  mode: 'serve' | 'build'
-}) {
-  const shouldDebug =
-    process.env.NODE_ENV === 'development' && codeIn.startsWith('// debug')
-
-  if (shouldDebug) {
-    console.info(`[one] ${_id} input:`)
-    console.info(codeIn)
-  }
-
-  let id = _id.split('?')[0]
-
-  const extension = extname(id)
-
-  if (extension === '.css') {
-    return
-  }
-
-  if (!validParsers.has(extension)) {
-    return
-  }
-
-  const isPreProcess = id.startsWith(`vxrn-swc-preprocess:`)
-  if (isPreProcess) {
-    id = id.replace(`vxrn-swc-preprocess:`, '')
-  }
-
-  if (id.includes(`virtual:`)) {
-    return
-  }
-
-  let code = codeIn
-  let out: {
-    code: string
-    map?: any
-  } | null = null
-
-  // avoid double-processing files already handled by optimizeDeps
-  if (codeIn.endsWith(`// vxrn-did-babel`)) {
-    debug?.(`[skip babel] ${id}`)
-  } else {
-    const babelResult = await performBabelTransform({
-      id,
-      code,
-      environment,
-      production,
-      reactForRNVersion,
-      optionsIn,
-    })
-
-    if (babelResult) {
-      out = babelResult
-      code = babelResult.code
-    }
-  }
-
-  // Always run SWC for class transforms + react refresh
-  const swcOptions = {
-    environment,
-    mode: optionsIn?.mode || mode,
-    production,
-    ...optionsIn,
-  } satisfies Options
-
-  const swcOut = await transformSWC(id, code, {
-    es5: true,
-    noHMR: isPreProcess || environment === 'ssr',
-    ...swcOptions,
-  })
-
-  if (swcOut) {
-    debug?.(`[swc] ${id}`)
-    out = {
-      code: swcOut.code,
-      map: swcOut.map,
-    }
-  }
-
-  if (shouldDebug) {
-    console.info(`swcOptions`, swcOptions)
-    console.info(`final output:`, out?.code)
-  }
-
-  return out
-}
-
 export async function createVXRNCompilerPlugin(
   optionsIn?: Partial<Options>
 ): Promise<PluginOption[]> {
@@ -297,9 +193,12 @@ export async function createVXRNCompilerPlugin(
 
   const cssTransformCache = new Map<string, string>()
 
-  // fix so we can align the diff between vite and rollup id (rollup resolves from root monorepo)
-  const rollupPath = resolvePath('rollup')
-  const rollupNodeMods = rollupPath.slice(0, rollupPath.indexOf(sep + 'node_modules'))
+  // fix so we can align the diff between vite and rolldown id (rolldown resolves from root monorepo)
+  const rolldownPath = resolvePath('rolldown')
+  const rolldownNodeMods = rolldownPath.slice(
+    0,
+    rolldownPath.indexOf(sep + 'node_modules')
+  )
 
   /**
    * Vite config, filled by a `configResolved` hook.
@@ -349,7 +248,7 @@ export async function createVXRNCompilerPlugin(
             const newId = `${id}.js`
 
             // rollup uses relative to its node_modules parent dir, vite here uses absolute
-            const cssId = newId.replace(rollupNodeMods + sep, '')
+            const cssId = newId.replace(rolldownNodeMods + sep, '')
             cssTransformCache.set(cssId, code)
 
             return {
@@ -402,87 +301,76 @@ ${rootJS.code}
       enforce: 'pre',
 
       config: () => {
+        const nodeModulesFilter = /node_modules\/.*\.(tsx?|jsx?|mjs|cjs)$/
+
         const createEnvironmentConfig = (environment: Environment) => {
+          // init stats for this environment
+          if (!perfStats.optimizeDeps.byEnvironment[environment]) {
+            perfStats.optimizeDeps.byEnvironment[environment] = {
+              filesChecked: 0,
+              filesTransformed: 0,
+              startTime: Date.now(),
+            }
+          }
+
           return {
             optimizeDeps: {
-              esbuildOptions: {
+              rolldownOptions: {
                 plugins: [
                   {
                     name: `transform-before-optimize-deps-${environment}`,
-                    setup(build) {
-                      // Init stats for this environment
-                      if (!perfStats.optimizeDeps.byEnvironment[environment]) {
-                        perfStats.optimizeDeps.byEnvironment[environment] = {
-                          filesChecked: 0,
-                          filesTransformed: 0,
-                          startTime: Date.now(),
-                        }
+
+                    async transform(code: string, id: string) {
+                      if (!nodeModulesFilter.test(id)) {
+                        return null
                       }
 
-                      build.onLoad(
-                        { filter: /node_modules\/.*\.(tsx?|jsx?|mjs|cjs)$/ },
-                        async (args) => {
-                          perfStats.optimizeDeps.byEnvironment[environment].filesChecked++
-
-                          const production =
-                            process.env.NODE_ENV === 'production' ||
-                            process.env.NODE_ENV === 'test'
-                          const code = await readFile(args.path, 'utf-8')
-
-                          debug?.(`[esbuild optimizeDeps] ${args.path}`)
-
-                          const result = await performBabelTransform({
-                            id: args.path,
-                            code,
-                            environment,
-                            production,
-                            reactForRNVersion,
-                            optionsIn,
-                          })
-
-                          if (!result) {
-                            return null
-                          }
-
-                          perfStats.optimizeDeps.byEnvironment[environment]
-                            .filesTransformed++
-
-                          // Determine loader based on file extension
-                          const ext = extname(args.path)
-                          const loader =
-                            ext === '.tsx'
-                              ? 'tsx'
-                              : ext === '.ts'
-                                ? 'ts'
-                                : ext === '.jsx'
-                                  ? 'jsx'
-                                  : 'js'
-
-                          return {
-                            contents: result.code,
-                            loader,
-                          }
-                        }
-                      )
-
-                      build.onEnd(() => {
-                        // Only log detailed stats when debugging
-                        if (process.env.DEBUG_COMPILER_PERF) {
-                          const stats = perfStats.optimizeDeps.byEnvironment[environment]
-                          const elapsed = Date.now() - stats.startTime
-                          console.info(
-                            `[optimizeDeps ${environment}] Done: ${stats.filesChecked} files checked, ${stats.filesTransformed} transformed (${elapsed}ms)`
-                          )
-                        }
-
-                        // Log cache stats when all environments are done
-                        const allDone =
-                          Object.keys(perfStats.optimizeDeps.byEnvironment).length >= 2
-                        if (allDone) {
-                          logCacheStats()
-                          logPerfSummary()
-                        }
+                      perfStats.optimizeDeps.byEnvironment[environment].filesChecked++
+
+                      const production =
+                        process.env.NODE_ENV === 'production' ||
+                        process.env.NODE_ENV === 'test'
+
+                      debug?.(`[rolldown optimizeDeps] ${id}`)
+
+                      const result = await performBabelTransform({
+                        id,
+                        code,
+                        environment,
+                        production,
+                        reactForRNVersion,
+                        optionsIn,
                       })
+
+                      if (!result) {
+                        return null
+                      }
+
+                      perfStats.optimizeDeps.byEnvironment[environment].filesTransformed++
+
+                      return {
+                        code: result.code,
+                        map: result.map,
+                      }
+                    },
+
+                    buildEnd() {
+                      // only log detailed stats when debugging
+                      if (process.env.DEBUG_COMPILER_PERF) {
+                        const stats = perfStats.optimizeDeps.byEnvironment[environment]
+                        const elapsed = Date.now() - stats.startTime
+                        console.info(
+                          `[optimizeDeps ${environment}] Done: ${stats.filesChecked} files checked, ${stats.filesTransformed} transformed (${elapsed}ms)`
+                        )
+                      }
+
+                      // log cache stats when all environments are done
+                      const allDone =
+                        Object.keys(perfStats.optimizeDeps.byEnvironment).length >= 2
+                      if (allDone) {
+                        logCacheStats()
+                        logPerfSummary()
+                      }
                     },
                   },
                 ],
@@ -539,16 +427,86 @@ ${rootJS.code}
           return code
         }
 
-        return performFullTransform({
-          codeIn,
-          _id,
+        // filter out non-transformable files
+        const id = _id.split('?')[0]
+        const extension = extname(id)
+
+        if (extension === '.css' || !validParsers.has(extension)) {
+          return
+        }
+
+        if (id.includes(`virtual:`)) {
+          return
+        }
+
+        // avoid double-processing files already handled by optimizeDeps
+        if (codeIn.endsWith(`// vxrn-did-babel`)) {
+          debug?.(`[skip babel] ${id}`)
+          return
+        }
+
+        return performBabelTransform({
+          id,
+          code: codeIn,
           environment,
           production,
           reactForRNVersion,
           optionsIn,
-          mode: config.command,
         })
       },
     },
+
+    // wraps client-side TSX/JSX with React Refresh preamble + import.meta.hot.accept
+    // runs after vite:oxc (no enforce:'pre') so it sees the already-transformed code
+    {
+      name: 'one:react-refresh-web',
+      apply: 'serve',
+
+      transform(code, _id) {
+        if (this.environment.name !== 'client') return
+        if (code.includes(runtimePublicPath)) return // already wrapped
+
+        const id = _id.split('?')[0]
+        if (id.includes('node_modules')) return
+        if (id.includes('virtual:')) return
+        if (id === runtimePublicPath) return
+
+        const ext = extname(id)
+        if (ext !== '.tsx' && ext !== '.jsx') return
+
+        const hasRefreshCalls = /\$RefreshReg\$\(/.test(code)
+
+        let out = `import * as RefreshRuntime from "${runtimePublicPath}";\n\n`
+
+        if (hasRefreshCalls) {
+          out += `if (!window.$RefreshReg$) throw new Error("React refresh preamble was not loaded. Something is wrong.");
+const prevRefreshReg = window.$RefreshReg$;
+const prevRefreshSig = window.$RefreshSig$;
+window.$RefreshReg$ = RefreshRuntime.getRefreshReg("${id}");
+window.$RefreshSig$ = RefreshRuntime.createSignatureFunctionForTransform;
+
+`
+        }
+
+        out += code
+
+        if (hasRefreshCalls) {
+          out += `\n\nwindow.$RefreshReg$ = prevRefreshReg;\nwindow.$RefreshSig$ = prevRefreshSig;\n`
+        }
+
+        out += `
+RefreshRuntime.__hmr_import(import.meta.url).then((currentExports) => {
+  RefreshRuntime.registerExportsForReactRefresh("${id}", currentExports);
+  import.meta.hot.accept((nextExports) => {
+    if (!nextExports) return;
+    const invalidateMessage = RefreshRuntime.validateRefreshBoundaryAndEnqueueUpdate("${id}", currentExports, nextExports);
+    if (invalidateMessage) import.meta.hot.invalidate(invalidateMessage);
+  });
+});
+`
+
+        return { code: out, map: null }
+      },
+    },
   ]
 }

package/types/constants.d.ts

@@ -1,9 +1,8 @@
-import type { ParserConfig } from '@swc/core';
 export declare const debug: (((...args: any[]) => any) & {
     namespace: string;
 }) | undefined;
 export declare const runtimePublicPath = "/@react-refresh";
 export declare const asyncGeneratorRegex: RegExp;
-export declare const parsers: Record<string, ParserConfig>;
+export declare const parsers: Record<string, any>;
 export declare const validParsers: Set<string>;
 //# sourceMappingURL=constants.d.ts.map

package/types/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAI7C,eAAO,MAAQ,KAAK;;cAA2C,CAAA;AAE/D,eAAO,MAAM,iBAAiB,oBAAoB,CAAA;AAElD,eAAO,MAAM,mBAAmB,QAA0C,CAAA;AAE1E,eAAO,MAAM,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CA8BhD,CAAA;AAED,eAAO,MAAM,YAAY,aAA6C,CAAA"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAEA,eAAO,MAAQ,KAAK;;cAA2C,CAAA;AAE/D,eAAO,MAAM,iBAAiB,oBAAoB,CAAA;AAElD,eAAO,MAAM,mBAAmB,QAA0C,CAAA;AAG1E,eAAO,MAAM,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CA8BvC,CAAA;AAED,eAAO,MAAM,YAAY,aAA6C,CAAA"}

package/types/index.d.ts

@@ -1,6 +1,7 @@
 /**
- * Adapted from https://github.com/vitejs/vite-plugin-react-swc/blob/main/src/index.ts
- * to work on both native and web, and with reanimated and other babel fallbacks
+ * Compiler plugin for One/VXRN
+ * Automates babel transforms (react compiler, codegen, user transforms) and
+ * react native CSS-to-JS conversion.
  */
 import type { PluginOption } from 'vite';
 import type { Options } from './types';

package/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AASH,OAAO,KAAK,EAAE,YAAY,EAA8B,MAAM,MAAM,CAAA;AAKpE,OAAO,KAAK,EAAkC,OAAO,EAAE,MAAM,SAAS,CAAA;AAGtE,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AA2P3C,wBAAsB,wBAAwB,CAC5C,SAAS,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CAqRzB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AASH,OAAO,KAAK,EAAE,YAAY,EAA8B,MAAM,MAAM,CAAA;AAIpE,OAAO,KAAK,EAAkC,OAAO,EAAE,MAAM,SAAS,CAAA;AAGtE,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAmJ3C,wBAAsB,wBAAwB,CAC5C,SAAS,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CAmVzB"}