perf: import esbuild dynamically

packages/vite/src/node/config.ts

@@ -8,7 +8,6 @@ import { createRequire } from 'node:module'
 import colors from 'picocolors'
 import type { Alias, AliasOptions } from 'dep-types/alias'
 import aliasPlugin from '@rollup/plugin-alias'
-import { build } from 'esbuild'
 import type { RollupOptions } from 'rollup'
 import type { HookHandler, Plugin, PluginWithRequiredHook } from './plugin'
 import type {
@@ -1009,6 +1008,8 @@ async function bundleConfigFile(
   const dirnameVarName = '__vite_injected_original_dirname'
   const filenameVarName = '__vite_injected_original_filename'
   const importMetaUrlVarName = '__vite_injected_original_import_meta_url'
+
+  const { build } = await import('esbuild')
   const result = await build({
     absWorkingDir: process.cwd(),
     entryPoints: [fileName],

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

@@ -5,7 +5,6 @@ import { promisify } from 'node:util'
 import { performance } from 'node:perf_hooks'
 import colors from 'picocolors'
 import type { BuildContext, BuildOptions as EsbuildBuildOptions } from 'esbuild'
-import esbuild, { build } from 'esbuild'
 import { init, parse } from 'es-module-lexer'
 import glob from 'fast-glob'
 import { getDepOptimizationConfig } from '../config'
@@ -759,6 +758,7 @@ async function prepareEsbuildOptimizerRun(
   }
   plugins.push(esbuildDepPlugin(flatIdDeps, external, config, ssr))
 
+  const esbuild = (await import('esbuild')).default
   const context = await esbuild.context({
     absWorkingDir: process.cwd(),
     entryPoints: Object.keys(flatIdDeps),
@@ -1058,6 +1058,7 @@ export async function extractExportsData(
     // For custom supported extensions, build the entry file to transform it into JS,
     // and then parse with es-module-lexer. Note that the `bundle` option is not `true`,
     // so only the entry file is being transformed.
+    const { build } = await import('esbuild')
     const result = await build({
       ...esbuildOptions,
       entryPoints: [filePath],

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

@@ -10,7 +10,6 @@ import type {
   OnLoadResult,
   Plugin,
 } from 'esbuild'
-import esbuild, { formatMessages, transform } from 'esbuild'
 import colors from 'picocolors'
 import type { ResolvedConfig } from '..'
 import {
@@ -135,6 +134,7 @@ export function scanImports(config: ResolvedConfig): {
 
   `)
       if (e.errors) {
+        const { formatMessages } = await import('esbuild')
         const msgs = await formatMessages(e.errors, {
           kind: 'error',
           color: true,
@@ -216,6 +216,7 @@ async function prepareEsbuildScanner(
   const { plugins = [], ...esbuildOptions } =
     config.optimizeDeps?.esbuildOptions ?? {}
 
+  const esbuild = (await import('esbuild')).default
   return await esbuild.context({
     absWorkingDir: process.cwd(),
     write: false,
@@ -315,6 +316,7 @@ function esbuildScanPlugin(
     let transpiledContents
     // transpile because `transformGlobImport` only expects js
     if (loader !== 'js') {
+      const { transform } = await import('esbuild')
       transpiledContents = (await transform(contents, { loader })).code
     } else {
       transpiledContents = contents

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

@@ -22,7 +22,6 @@ import type Less from 'less'
 import type { Alias } from 'dep-types/alias'
 import type { LightningCSSOptions } from 'dep-types/lightningcss'
 import type { TransformOptions } from 'esbuild'
-import { formatMessages, transform } from 'esbuild'
 import type { RawSourceMap } from '@ampproject/remapping'
 import { getCodeWithSourcemap, injectSourcesContent } from '../server/sourcemap'
 import type { ModuleNode } from '../server/moduleGraph'
@@ -1723,6 +1722,8 @@ async function minifyCSS(
     // LightningCSS output does not return a linebreak at the end
     return code.toString() + (inlined ? '' : '\n')
   }
+
+  const { formatMessages, transform } = await import('esbuild')
   try {
     const { code, warnings } = await transform(css, {
       loader: 'css',

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

@@ -1,4 +1,3 @@
-import { transform } from 'esbuild'
 import type { ResolvedConfig } from '../config'
 import type { Plugin } from '../plugin'
 import { escapeRegex, getHash } from '../utils'
@@ -148,6 +147,7 @@ export async function replaceDefine(
 
   const esbuildOptions = config.esbuild || {}
 
+  const { transform } = await import('esbuild')
   const result = await transform(code, {
     loader: 'js',
     charset: esbuildOptions.charset ?? 'utf8',

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

@@ -6,7 +6,6 @@ import type {
   TransformOptions,
   TransformResult,
 } from 'esbuild'
-import { transform } from 'esbuild'
 import type { RawSourceMap } from '@ampproject/remapping'
 import type { InternalModuleFormat, SourceMap } from 'rollup'
 import type { TSConfckParseResult } from 'tsconfck'
@@ -173,6 +172,7 @@ export async function transformWithEsbuild(
   delete resolvedOptions.jsxInject
 
   try {
+    const { transform } = await import('esbuild')
     const result = await transform(code, resolvedOptions)
     let map: SourceMap
     if (inMap && resolvedOptions.sourcemap) {