feat: oxc tranformer (#60)

Co-authored-by: IWANABETHATGUY <[email protected]>

Author: 2 people

packages/vite/rollup.dts.config.ts

@@ -17,6 +17,7 @@ const external = [
   /^node:*/,
   /^vite\//,
   'rollup/parseAst',
+  'rolldown/experimental',
   ...Object.keys(pkg.dependencies),
   ...Object.keys(pkg.peerDependencies),
   ...Object.keys(pkg.devDependencies),
@@ -52,6 +53,9 @@ const identifierReplacements: Record<string, Record<string, string>> = {
     TransformPluginContext$1: 'rolldown.TransformPluginContext',
     TransformResult$2: 'rolldown.TransformResult',
   },
+  'rolldown/experimental': {
+    TransformOptions$2: 'rolldown_experimental_TransformOptions',
+  },
   esbuild: {
     TransformResult$1: 'esbuild_TransformResult',
     TransformOptions$1: 'esbuild_TransformOptions',

packages/vite/src/node/__tests__/plugins/import.spec.ts

@@ -73,9 +73,13 @@ describe('transformCjsImport', () => {
         '',
         config,
       ),
-    ).toBe(
-      'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
-        `const react = ((m) => m?.__esModule ? m : { ...typeof m === "object" && !Array.isArray(m) || typeof m === "function" ? m : {}, default: m })(__vite__cjsImport0_react)`,
+    ).toMatchInlineSnapshot(
+      `
+      "import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; const react = ((m) => m?.__esModule ? m : {
+      	...typeof m === "object" && !Array.isArray(m) || typeof m === "function" ? m : {},
+      	default: m
+      })(__vite__cjsImport0_react)"
+    `,
     )
   })
 

packages/vite/src/node/config.ts

@@ -98,6 +98,7 @@ import type { ResolvedSSROptions, SSROptions } from './ssr'
 import { resolveSSROptions, ssrConfigDefaults } from './ssr'
 import { PartialEnvironment } from './baseEnvironment'
 import { createIdResolver } from './idResolver'
+import { type OxcOptions, convertEsbuildConfigToOxcConfig } from './plugins/oxc'
 
 const debug = createDebugger('vite:config', { depth: 10 })
 const promisifiedRealpath = promisify(fs.realpath)
@@ -349,6 +350,11 @@ export interface UserConfig extends DefaultEnvironmentOptions {
    * Or set to `false` to disable esbuild.
    */
   esbuild?: ESBuildOptions | false
+  /**
+   * Transform options to pass to esbuild.
+   * Or set to `false` to disable esbuild.
+   */
+  oxc?: OxcOptions | false
   /**
    * Specify additional picomatch patterns to be treated as static assets.
    */
@@ -584,7 +590,8 @@ export type ResolvedConfig = Readonly<
     plugins: readonly Plugin[]
     css: ResolvedCSSOptions
     json: Required<JsonOptions>
-    esbuild: ESBuildOptions | false
+    // esbuild: ESBuildOptions | false
+    oxc: OxcOptions | false
     server: ResolvedServerOptions
     dev: ResolvedDevEnvironmentOptions
     /** @experimental */
@@ -1466,6 +1473,18 @@ export async function resolveConfig(
 
   const base = withTrailingSlash(resolvedBase)
 
+  let oxc: OxcOptions | false | undefined = config.oxc
+
+  if (config.esbuild) {
+    if (config.oxc) {
+      logger.warn(
+        `Found esbuild and oxc options, will use oxc and ignore esbuild at transformer.`,
+      )
+    } else {
+      oxc = convertEsbuildConfigToOxcConfig(config.esbuild, logger)
+    }
+  }
+
   resolved = {
     configFile: configFile ? normalizePath(configFile) : undefined,
     configFileDependencies: configFileDependencies.map((name) =>
@@ -1487,12 +1506,17 @@ export async function resolveConfig(
     plugins: userPlugins, // placeholder to be replaced
     css: resolveCSSOptions(config.css),
     json: mergeWithDefaults(configDefaults.json, config.json ?? {}),
-    esbuild:
-      config.esbuild === false
+    // preserve esbuild for buildEsbuildPlugin
+    esbuild: config.esbuild ?? {},
+    oxc:
+      oxc === false
         ? false
         : {
-            jsxDev: !isProduction,
-            ...config.esbuild,
+            ...oxc,
+            jsx: {
+              development: !isProduction,
+              ...oxc?.jsx,
+            },
           },
     server,
     builder,

packages/vite/src/node/optimizer/index.ts

@@ -28,9 +28,10 @@ import {
   unique,
 } from '../utils'
 import { transformWithEsbuild } from '../plugins/esbuild'
-import { ESBUILD_MODULES_TARGET, METADATA_FILENAME } from '../constants'
+import { METADATA_FILENAME } from '../constants'
 import { isWindows } from '../../shared/utils'
 import type { Environment } from '../environment'
+import { transformWithOxc } from '../plugins/oxc'
 import { ScanEnvironment, scanImports } from './scan'
 import { createOptimizeDepsIncludeResolver, expandGlobIds } from './resolve'
 import {
@@ -770,12 +771,9 @@ async function prepareRolldownOptimizerRun(
     name: 'optimizer-transform',
     async transform(code, id) {
       if (/\.(?:m?[jt]s|[jt]sx)$/.test(id)) {
-        const result = await transformWithEsbuild(code, id, {
+        const result = await transformWithOxc(this, code, id, {
           sourcemap: true,
-          sourcefile: id,
-          loader: jsxLoader && /\.js$/.test(id) ? 'jsx' : undefined,
-          define,
-          target: ESBUILD_MODULES_TARGET,
+          lang: jsxLoader && /\.js$/.test(id) ? 'jsx' : undefined,
         })
         return {
           code: result.code,
@@ -792,6 +790,7 @@ async function prepareRolldownOptimizerRun(
       input: flatIdDeps,
       logLevel: 'warn',
       plugins,
+      define,
       platform,
       resolve: {
         // TODO: set aliasFields, conditionNames depending on `platform`

packages/vite/src/node/plugins/index.ts

@@ -17,7 +17,6 @@ import { watchPackageDataPlugin } from '../packages'
 import { jsonPlugin } from './json'
 import { filteredResolvePlugin, resolvePlugin } from './resolve'
 import { optimizedDepsPlugin } from './optimizedDeps'
-import { esbuildPlugin } from './esbuild'
 import { importAnalysisPlugin } from './importAnalysis'
 import { cssAnalysisPlugin, cssPlugin, cssPostPlugin } from './css'
 import { assetPlugin } from './asset'
@@ -33,6 +32,7 @@ import { assetImportMetaUrlPlugin } from './assetImportMetaUrl'
 import { metadataPlugin } from './metadata'
 import { dynamicImportVarsPlugin } from './dynamicImportVars'
 import { importGlobPlugin } from './importMetaGlob'
+import { oxcPlugin } from './oxc'
 
 export async function resolvePlugins(
   config: ResolvedConfig,
@@ -102,10 +102,10 @@ export async function resolvePlugins(
         }),
     htmlInlineProxyPlugin(config),
     cssPlugin(config),
-    config.esbuild !== false
+    config.oxc !== false
       ? enableNativePlugin
         ? nativeTransformPlugin()
-        : esbuildPlugin(config)
+        : oxcPlugin(config)
       : null,
     enableNativePlugin
       ? nativeJsonPlugin({