feat: ship runtime code in es2017 by default

packages/compat/plugin-swc/src/plugin.ts

@@ -58,6 +58,7 @@ export const pluginSwc = (options: PluginSwcOptions = {}): RsbuildPlugin => ({
         } else {
           applyScriptCondition({
             rule: chain.module.rule(CHAIN_ID.RULE.JS),
+            chain,
             config: rsbuildConfig,
             context: api.context,
             includes: [],

packages/core/modern.config.ts

@@ -6,12 +6,12 @@ export default defineConfig({
   buildConfig: [
     {
       ...baseBuildConfig.buildConfig,
-      input: ['src', '!src/client/hmr',  '!src/client/overlay.ts'],
+      input: ['src', '!src/client/hmr', '!src/client/overlay.ts'],
     },
     {
       buildType: 'bundle',
       format: 'esm',
-      target: 'es5',
+      target: 'es2017',
       dts: false,
       input: {
         hmr: 'src/client/hmr/index.ts',
@@ -20,6 +20,13 @@ export default defineConfig({
       externals: ['./hmr'],
       outDir: './dist/client',
       autoExtension: true,
+      externalHelpers: true,
+      // Skip esbuild transform and only use SWC to transform,
+      // because esbuild will transform `import.meta`.
+      esbuildOptions: (options) => {
+        options.target = undefined;
+        return options;
+      },
     },
   ],
 });

packages/core/src/plugins/target.ts

@@ -8,26 +8,29 @@ export const pluginTarget = (): RsbuildPlugin => ({
   name: 'rsbuild:target',
 
   setup(api) {
-    api.modifyBundlerChain(async (chain, { target }) => {
-      if (target === 'node') {
-        chain.target('node');
-        return;
-      }
+    api.modifyBundlerChain({
+      order: 'pre',
+      handler: async (chain, { target }) => {
+        if (target === 'node') {
+          chain.target('node');
+          return;
+        }
 
-      const config = api.getNormalizedConfig();
-      const browserslist = await getBrowserslistWithDefault(
-        api.context.rootPath,
-        config,
-        target,
-      );
-      const esVersion = browserslistToESVersion(browserslist);
+        const config = api.getNormalizedConfig();
+        const browserslist = await getBrowserslistWithDefault(
+          api.context.rootPath,
+          config,
+          target,
+        );
+        const esVersion = browserslistToESVersion(browserslist);
 
-      if (target === 'web-worker' || target === 'service-worker') {
-        chain.target(['webworker', `es${esVersion}`]);
-        return;
-      }
+        if (target === 'web-worker' || target === 'service-worker') {
+          chain.target(['webworker', `es${esVersion}`]);
+          return;
+        }
 
-      chain.target(['web', `es${esVersion}`]);
+        chain.target(['web', `es${esVersion}`]);
+      },
     });
   },
 });

packages/core/src/provider/plugins/swc.ts

@@ -65,6 +65,7 @@ export const pluginSwc = (): RsbuildPlugin => ({
 
         applyScriptCondition({
           rule,
+          chain,
           config,
           context: api.context,
           includes: [],

packages/shared/src/chain.ts

@@ -239,12 +239,14 @@ export type ChainIdentifier = typeof CHAIN_ID;
 
 export function applyScriptCondition({
   rule,
+  chain,
   config,
   context,
   includes,
   excludes,
 }: {
   rule: BundlerChainRule;
+  chain: BundlerChain;
   config: NormalizedConfig;
   context: RsbuildContext;
   includes: (string | RegExp)[];
@@ -260,6 +262,14 @@ export function applyScriptCondition({
   // Otherwise, it will lead to compilation errors and incorrect output.
   rule.include.add(TS_AND_JSX_REGEX);
 
+  // The Rsbuild runtime code is es2017 by default,
+  // transform the runtime code if user target < es2017
+  const target = castArray(chain.get('target'));
+  const legacyTarget = ['es5', 'es6', 'es2015', 'es2016'];
+  if (legacyTarget.some((item) => target.includes(item))) {
+    rule.include.add(/[\\/]@rsbuild[\\/]core[\\/]/);
+  }
+
   for (const condition of [...includes, ...(config.source.include || [])]) {
     rule.include.add(condition);
   }