feat: use esbuild supported feature (#8665)

package.json

@@ -63,7 +63,7 @@
     "@typescript-eslint/parser": "^5.28.0",
     "conventional-changelog-cli": "^2.2.2",
     "cross-env": "^7.0.3",
-    "esbuild": "^0.14.43",
+    "esbuild": "^0.14.47",
     "eslint": "^8.18.0",
     "eslint-define-config": "^1.5.1",
     "eslint-plugin-import": "^2.26.0",

packages/vite/package.json

@@ -57,7 +57,7 @@
   },
   "//": "READ CONTRIBUTING.md to understand what to put under deps vs. devDeps!",
   "dependencies": {
-    "esbuild": "^0.14.43",
+    "esbuild": "^0.14.47",
     "postcss": "^8.4.14",
     "resolve": "^1.22.1",
     "rollup": "^2.75.6"

packages/vite/src/node/build.ts

@@ -47,7 +47,7 @@ import { loadFallbackPlugin } from './plugins/loadFallback'
 import type { PackageData } from './packages'
 import { watchPackageDataPlugin } from './packages'
 import { ensureWatchPlugin } from './plugins/ensureWatch'
-import { VERSION } from './constants'
+import { ESBUILD_MODULES_TARGET, VERSION } from './constants'
 
 export interface BuildOptions {
   /**
@@ -270,15 +270,7 @@ export function resolveBuildOptions(
 
   // handle special build targets
   if (resolved.target === 'modules') {
-    // Support browserslist
-    // "defaults and supports es6-module and supports es6-module-dynamic-import",
-    resolved.target = [
-      'es2020', // support import.meta.url
-      'edge88',
-      'firefox78',
-      'chrome87',
-      'safari13' // transpile nullish coalescing
-    ]
+    resolved.target = ESBUILD_MODULES_TARGET
   } else if (resolved.target === 'esnext' && resolved.minify === 'terser') {
     // esnext + terser: limit to es2021 so it can be minified by terser
     resolved.target = 'es2021'

packages/vite/src/node/constants.ts

@@ -11,6 +11,16 @@ export const DEFAULT_MAIN_FIELDS = [
   'jsnext'
 ]
 
+// Support browserslist
+// "defaults and supports es6-module and supports es6-module-dynamic-import",
+export const ESBUILD_MODULES_TARGET = [
+  'es2020', // support import.meta.url
+  'edge88',
+  'firefox78',
+  'chrome87',
+  'safari13' // transpile nullish coalescing
+]
+
 export const DEFAULT_EXTENSIONS = [
   '.mjs',
   '.js',

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

@@ -22,6 +22,7 @@ import {
   writeFile
 } from '../utils'
 import { transformWithEsbuild } from '../plugins/esbuild'
+import { ESBUILD_MODULES_TARGET } from '../constants'
 import { esbuildDepPlugin } from './esbuildDepPlugin'
 import { scanImports } from './scan'
 export { initDepsOptimizer, getDepsOptimizer } from './optimizer'
@@ -559,7 +560,7 @@ export async function runOptimizeDeps(
         : 'browser',
     define,
     format: 'esm',
-    target: config.build.target || undefined,
+    target: isBuild ? config.build.target || undefined : ESBUILD_MODULES_TARGET,
     external: config.optimizeDeps?.exclude,
     logLevel: 'error',
     splitting: true,
@@ -571,7 +572,12 @@ export async function runOptimizeDeps(
       ...plugins,
       esbuildDepPlugin(flatIdDeps, flatIdToExports, config)
     ],
-    ...esbuildOptions
+    ...esbuildOptions,
+    supported: {
+      'dynamic-import': true,
+      'import-meta': true,
+      ...esbuildOptions.supported
+    }
   })
 
   const meta = result.metafile!

playground/lib/vite.config.js

@@ -5,6 +5,12 @@ const path = require('path')
  * @type {import('vite').UserConfig}
  */
 module.exports = {
+  esbuild: {
+    supported: {
+      // Force esbuild inject helpers to test regex
+      'object-rest-spread': false
+    }
+  },
   build: {
     rollupOptions: {
       output: {