@vxrn/compiler 1.1.546 → 1.1.547

package/src/index.ts

@@ -4,7 +4,6 @@
  */
 
 import { resolvePath } from '@vxrn/utils'
-import { createHash } from 'node:crypto'
 import { readFileSync } from 'node:fs'
 import { readFile } from 'node:fs/promises'
 import { extname, join, sep } from 'node:path'
@@ -22,16 +21,158 @@ export * from './transformBabel'
 export * from './transformSWC'
 export type { GetTransform } from './types'
 
-const getCacheId = (environment: string, id: string) => `${environment}${id}`
-const getCacheHash = (code: string) => createHash('sha1').update(code).digest('base64')
+// Shared Babel transform logic
+async function performBabelTransform({
+  id,
+  code,
+  environment,
+  production,
+  reactForRNVersion,
+  optionsIn,
+}: {
+  id: string
+  code: string
+  environment: Environment
+  production: boolean
+  reactForRNVersion: '18' | '19'
+  optionsIn?: Partial<Options>
+}) {
+  const transformProps: GetTransformProps = {
+    id,
+    code,
+    development: !production,
+    environment,
+    reactForRNVersion,
+  }
+
+  const userTransform = optionsIn?.transform?.(transformProps)
+
+  if (userTransform === false) {
+    return null
+  }
 
-export const clearCompilerCache = () => {
-  memoryCache = {}
-  cacheSize = 0
+  const isPreProcess = id.startsWith(`vxrn-swc-preprocess:`)
+
+  if (!isPreProcess && userTransform !== 'swc') {
+    const babelOptions = getBabelOptions({
+      ...transformProps,
+      userSetting: userTransform,
+    })
+
+    if (babelOptions) {
+      const babelOut = await transformBabel(id, code, babelOptions)
+      if (babelOut?.code) {
+        debug?.(`[babel] ${id}`)
+        return { code: babelOut.code, map: babelOut.map }
+      }
+    }
+  }
+
+  return null
 }
 
-let memoryCache: Record<string, { hash: string; out: { code: string; map?: any } }> = {}
-let cacheSize = 0
+// 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
+  }
+
+  // Skip node_modules to avoid double-processing files already handled by optimizeDeps
+  if (id.includes('node_modules')) {
+    debug?.(`[skip node_modules] ${id}`)
+    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
+
+  // Try Babel first
+  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>
@@ -141,21 +282,72 @@ ${rootJS.code}
       enforce: 'pre',
 
       config: () => {
-        const config = {
-          esbuild: false,
-          optimizeDeps: {
-            noDiscovery: true,
-          },
-
-          define: {
-            'process.env.NATIVEWIND_OS': 'native',
-          },
-        } satisfies UserConfig
+        const createEnvironmentConfig = (environment: Environment) => {
+          return {
+            optimizeDeps: {
+              esbuildOptions: {
+                plugins: [
+                  {
+                    name: `transform-before-optimize-deps-${environment}`,
+                    setup(build) {
+                      build.onLoad(
+                        { filter: /node_modules\/.*\.(tsx?|jsx?|mjs|cjs)$/ },
+                        async (args) => {
+                          const production = process.env.NODE_ENV === 'production'
+                          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
+                          }
+
+                          // 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,
+                          }
+                        }
+                      )
+                    },
+                  },
+                ],
+              },
+            },
+
+            define: {
+              'process.env.NATIVEWIND_OS': JSON.stringify(
+                environment === 'ios' || environment === 'android' ? 'native' : 'web'
+              ),
+            },
+          } satisfies UserConfig
+        }
 
         return {
           environments: {
-            ios: config,
-            android: config,
+            ios: createEnvironmentConfig('ios'),
+            android: createEnvironmentConfig('android'),
+            client: createEnvironmentConfig('client'),
+            ssr: createEnvironmentConfig('ssr'),
           },
         }
       },
@@ -190,119 +382,15 @@ ${rootJS.code}
           return code
         }
 
-        const shouldDebug = process.env.NODE_ENV === 'development' && codeIn.startsWith('// debug')
-
-        if (shouldDebug) {
-          console.info(`[one] ${_id} input:`)
-          console.info(codeIn)
-        }
-
-        const cacheId = getCacheId(environment, _id)
-        const cacheHash = getCacheHash(code)
-        const cached = memoryCache[cacheId]
-
-        if (cached?.hash === cacheHash) {
-          debug?.(`Using cache ${_id} ${cacheId}`)
-          return cached.out
-        }
-
-        let id = _id.split('?')[0]
-
-        const extension = extname(id)
-
-        if (extension === '.css') {
-          // handled in one:compiler-css-to-js
-          return
-        }
-
-        if (!validParsers.has(extension)) {
-          return
-        }
-
-        // pre process = hmr just are removing jsx but leaving imports as esm
-        const isPreProcess = id.startsWith(`vxrn-swc-preprocess:`)
-        if (isPreProcess) {
-          id = id.replace(`vxrn-swc-preprocess:`, '')
-        }
-
-        if (id.includes(`virtual:`)) {
-          return
-        }
-
-        const transformProps: GetTransformProps = {
-          id,
-          code,
-          development: !production,
+        return performFullTransform({
+          codeIn,
+          _id,
           environment,
-          reactForRNVersion,
-        }
-
-        const userTransform = optionsIn?.transform?.(transformProps)
-
-        if (userTransform === false) {
-          return
-        }
-
-        let out: {
-          code: string
-          map: any
-        } | null = null
-
-        if (!isPreProcess && userTransform !== 'swc') {
-          const babelOptions = getBabelOptions({
-            ...transformProps,
-            userSetting: userTransform,
-          })
-
-          if (babelOptions) {
-            const babelOut = await transformBabel(id, code, babelOptions)
-            if (babelOut?.code) {
-              debug?.(`[${id}] transformed with babel options: ${JSON.stringify(babelOptions)}`)
-              // TODO we may want to just avoid SWC after babel it likely is faster
-              // we'd need to have metro or metro-like preset
-              out = { code: babelOut.code, map: babelOut.map }
-            }
-          }
-        }
-
-        // on native we always go to swc for now to ensure class transforms + react refesh
-        // we could make the babel plugin support those if we want to avoid
-        const swcOptions = {
-          environment,
-          mode: optionsIn?.mode || config.command,
           production,
-          ...optionsIn,
-        } satisfies Options
-
-        const swcOut = await transformSWC(id, out?.code || code, {
-          es5: true,
-          // dont need refresh for ssr, but do for client
-          noHMR: isPreProcess || environment === 'ssr',
-          ...swcOptions,
+          reactForRNVersion,
+          optionsIn,
+          mode: config.command,
         })
-
-        if (swcOut) {
-          out = {
-            code: swcOut?.code,
-            map: swcOut?.map,
-          }
-        }
-
-        if (shouldDebug) {
-          console.info(`swcOptions`, swcOptions)
-          console.info(`final output:`, out?.code)
-        }
-
-        if (out) {
-          cacheSize += out?.code.length
-          // ~100Mb cache for recent compiler files
-          if (cacheSize > 52_428_800) {
-            clearCompilerCache()
-          }
-          memoryCache[cacheId] = { out, hash: cacheHash }
-        }
-
-        return out
       },
     },
   ]

package/src/transformBabel.ts

@@ -26,7 +26,6 @@ export function getBabelOptions(props: Props): babel.TransformOptions | null {
 }
 
 const getOptions = (props: Props, force = false): babel.TransformOptions | null => {
-  const presets: string[] = []
   let plugins: babel.PluginItem[] = []
 
   if (force || shouldBabelGenerators(props)) {
@@ -48,7 +47,7 @@ const getOptions = (props: Props, force = false): babel.TransformOptions | null
   }
 
   if (enableNativewind || shouldBabelReanimated(props)) {
-    debug?.(`Using babel reanimated on file`)
+    debug?.(`Using babel reanimated on file ${props.id}`)
     plugins.push(
       // TODO make this configurable
       process.env.VXRN_WORKLET_PLUGIN
@@ -67,8 +66,8 @@ const getOptions = (props: Props, force = false): babel.TransformOptions | null
     plugins.push('@react-native/babel-plugin-codegen')
   }
 
-  if (plugins.length || presets.length) {
-    return { plugins, presets }
+  if (plugins.length) {
+    return { plugins }
   }
 
   return null
@@ -79,43 +78,39 @@ const getOptions = (props: Props, force = false): babel.TransformOptions | null
  */
 export async function transformBabel(id: string, code: string, options: babel.TransformOptions) {
   const compilerPlugin = options.plugins?.find((x) => x && x[0] === 'babel-plugin-react-compiler')
+  const extension = extname(id)
+  const isTSX = extension === '.tsx'
+  const isTS = isTSX || extension === '.ts'
+  const babelOptions = {
+    filename: id,
+    compact: false,
+    babelrc: false,
+    configFile: false,
+    sourceMaps: false,
+    minified: false,
+    ...options,
+    presets: [
+      isTS
+        ? [
+            '@babel/preset-typescript',
+            {
+              isTSX,
+              allExtensions: isTSX,
+            },
+          ]
+        : '',
+      ...(options.presets || []),
+    ].filter(Boolean),
+  }
 
   try {
-    const extension = extname(id)
-    const isTSX = extension === '.tsx'
-    const isTS = isTSX || extension === '.ts'
-
     const out = await new Promise<babel.BabelFileResult>((res, rej) => {
-      babel.transform(
-        code,
-        {
-          filename: id,
-          compact: false,
-          babelrc: false,
-          configFile: false,
-          sourceMaps: false,
-          minified: false,
-          ...options,
-          presets: [
-            isTS
-              ? [
-                  '@babel/preset-typescript',
-                  {
-                    isTSX,
-                    allExtensions: isTSX,
-                  },
-                ]
-              : '',
-            ...(options.presets || []),
-          ].filter(Boolean),
-        },
-        (err: any, result) => {
-          if (!result || err) {
-            return rej(err || 'no res')
-          }
-          res(result!)
+      babel.transform(code, babelOptions, (err: any, result) => {
+        if (!result || err) {
+          return rej(err || 'no res')
         }
-      )
+        res(result!)
+      })
     })
 
     if (
@@ -130,7 +125,7 @@ export async function transformBabel(id: string, code: string, options: babel.Tr
 
     return out
   } catch (err) {
-    console.error(`[vxrn:compiler] babel transform error`, err)
+    console.error(`[vxrn:compiler] babel transform error`, err, `with options`, babelOptions)
     console.error('code', code)
     console.error('id', id)
   }
@@ -188,7 +183,7 @@ const shouldBabelReactCompiler = (props: Props) => {
       return false
     }
   }
-  if (!/.*(.tsx?)$/.test(props.id)) return false
+  if (!/(\.tsx?)$/.test(props.id)) return false
   // disable node modules for now...
   if (props.id.includes('node_modules')) return false
   // we had OG image generation on the server using react, this fixes a bug because compiler breaks @vercel/og

package/types/index.d.ts

@@ -8,6 +8,5 @@ export * from './configure';
 export * from './transformBabel';
 export * from './transformSWC';
 export type { GetTransform } from './types';
-export declare const clearCompilerCache: () => void;
 export declare function createVXRNCompilerPlugin(optionsIn?: Partial<Options>): Promise<PluginOption[]>;
 //# sourceMappingURL=index.d.ts.map

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;AAEtE,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAK3C,eAAO,MAAM,kBAAkB,YAG9B,CAAA;AAKD,wBAAsB,wBAAwB,CAC5C,SAAS,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CA+QzB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAQH,OAAO,KAAK,EAAE,YAAY,EAA8B,MAAM,MAAM,CAAA;AAKpE,OAAO,KAAK,EAAkC,OAAO,EAAE,MAAM,SAAS,CAAA;AAEtE,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AA2J3C,wBAAsB,wBAAwB,CAC5C,SAAS,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CA0NzB"}

package/types/transformBabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"transformBabel.d.ts","sourceRoot":"","sources":["../src/transformBabel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,aAAa,CAAA;AAK/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEtE,KAAK,KAAK,GAAG,iBAAiB,GAAG;IAC/B,WAAW,CAAC,EAAE,oBAAoB,CAAA;CACnC,CAAA;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,gBAAgB,GAAG,IAAI,CAc3E;AAmDD;;GAEG;AACH,wBAAsB,cAAc,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,gBAAgB,8CAyD7F"}
+{"version":3,"file":"transformBabel.d.ts","sourceRoot":"","sources":["../src/transformBabel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,aAAa,CAAA;AAK/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEtE,KAAK,KAAK,GAAG,iBAAiB,GAAG;IAC/B,WAAW,CAAC,EAAE,oBAAoB,CAAA;CACnC,CAAA;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,gBAAgB,GAAG,IAAI,CAc3E;AAkDD;;GAEG;AACH,wBAAsB,cAAc,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,gBAAgB,8CAqD7F"}