feat(bundler-webpack): update target of esbuild-loader (#1643)

Mister-Hope · meteorlxy · web-flow · commit a09e92d7ca1c · 2025-04-14T13:22:21.000+08:00
Co-authored-by: meteorlxy &lt;meteor.lxy@foxmail.com&gt;
diff --git a/packages/bundler-webpack/src/config/handleModuleJs.ts b/packages/bundler-webpack/src/config/handleModuleJs.ts
@@ -1,7 +1,7 @@
 import { createRequire } from 'node:module'
 import type Config from 'webpack-5-chain'
 import type { WebpackBundlerOptions } from '../types.js'
-import { resolveEsbuildJsxOptions } from './resolveEsbuildJsxOptions.js'
+import { resolveEsbuildLoaderOptions } from './resolveEsbuildLoaderOptions.js'
 
 const require = createRequire(import.meta.url)
 
@@ -51,9 +51,6 @@ export const handleModuleJs = ({
     // use esbuild-loader
     .use('esbuild-loader')
     .loader(require.resolve('esbuild-loader'))
-    .options({
-      target: 'es2015',
-      ...resolveEsbuildJsxOptions(),
-    })
+    .options(resolveEsbuildLoaderOptions())
     .end()
 }
diff --git a/packages/bundler-webpack/src/config/handleModuleTs.ts b/packages/bundler-webpack/src/config/handleModuleTs.ts
@@ -1,6 +1,6 @@
 import { createRequire } from 'node:module'
 import type Config from 'webpack-5-chain'
-import { resolveEsbuildJsxOptions } from './resolveEsbuildJsxOptions.js'
+import { resolveEsbuildLoaderOptions } from './resolveEsbuildLoaderOptions.js'
 
 const require = createRequire(import.meta.url)
 
@@ -14,10 +14,10 @@ export const handleModuleTs = ({ config }: { config: Config }): void => {
     // use esbuild-loader
     .use('esbuild-loader')
     .loader(require.resolve('esbuild-loader'))
-    .options({
-      target: 'es2018',
-      loader: 'tsx',
-      ...resolveEsbuildJsxOptions(),
-    })
+    .options(
+      resolveEsbuildLoaderOptions({
+        loader: 'tsx',
+      }),
+    )
     .end()
 }
diff --git a/packages/bundler-webpack/src/config/resolveEsbuildJsxOptions.ts b/packages/bundler-webpack/src/config/resolveEsbuildJsxOptions.ts
diff --git a/packages/bundler-webpack/src/config/resolveEsbuildLoaderOptions.ts b/packages/bundler-webpack/src/config/resolveEsbuildLoaderOptions.ts
@@ -0,0 +1,23 @@
+import type { EsbuildPluginOptions } from 'esbuild-loader'
+
+export const resolveEsbuildLoaderOptions = (
+  options: EsbuildPluginOptions = {},
+): EsbuildPluginOptions => ({
+  /**
+   * keep consistent with vite
+   *
+   * @see https://vite.dev/config/build-options.html#build-target
+   */
+  target: ['es2020', 'edge88', 'firefox78', 'chrome87', 'safari14'],
+
+  /**
+   * jsx options
+   */
+  jsxFactory: 'jsx',
+  jsxFragment: 'Fragment',
+
+  /**
+   * overrides
+   */
+  ...options,
+})
