feat: introduce v2 native plugins and enable it by default (#21268)

Author: shulaoda

packages/vite/src/node/config.ts

@@ -558,12 +558,13 @@ export interface ExperimentalOptions {
    *
    * - 'resolver' (deprecated, will be removed in v8 stable): Enable only the native resolver plugin.
    * - 'v1' (will be deprecated, will be removed in v8 stable): Enable the first stable set of native plugins (including resolver).
-   * - true: Enable all native plugins (currently an alias of 'v1', it will map to a newer one in the future versions).
+   * - 'v2' (will be deprecated, will be removed in v8 stable): Enable the improved dynamicImportVarsPlugin and importGlobPlugin.
+   * - true: Enable all native plugins (currently an alias of 'v2', it will map to a newer one in the future versions).
    *
    * @experimental
-   * @default 'v1'
+   * @default 'v2'
    */
-  enableNativePlugin?: boolean | 'resolver' | 'v1'
+  enableNativePlugin?: boolean | 'resolver' | 'v1' | 'v2'
   /**
    * Enable full bundle mode.
    *
@@ -787,7 +788,7 @@ const configDefaults = Object.freeze({
     importGlobRestoreExtension: false,
     renderBuiltUrl: undefined,
     hmrPartialAccept: false,
-    enableNativePlugin: process.env._VITE_TEST_JS_PLUGIN ? false : 'v1',
+    enableNativePlugin: process.env._VITE_TEST_JS_PLUGIN ? false : 'v2',
     bundledDev: false,
   },
   future: {
@@ -2092,8 +2093,10 @@ function resolveNativePluginEnabledLevel(
     case 'resolver':
       return 0
     case 'v1':
-    case true:
       return 1
+    case 'v2':
+    case true:
+      return 2
     case false:
       return -1
     default:

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

@@ -184,6 +184,12 @@ export function dynamicImportVarsPlugin(config: ResolvedConfig): Plugin {
         resolver(id, importer) {
           return resolve(environment, id, importer)
         },
+        isV2:
+          config.nativePluginEnabledLevel >= 2
+            ? {
+                sourcemap: !!environment.config.build.sourcemap,
+              }
+            : undefined,
       })
     })
   }

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

@@ -46,6 +46,12 @@ export function importGlobPlugin(config: ResolvedConfig): Plugin {
     return nativeImportGlobPlugin({
       root: config.root,
       restoreQueryExtension: config.experimental.importGlobRestoreExtension,
+      isV2:
+        config.nativePluginEnabledLevel >= 2
+          ? {
+              sourcemap: !!config.build.sourcemap,
+            }
+          : undefined,
     })
   }
 

playground/glob-import/__tests__/glob-import.spec.ts

@@ -303,3 +303,11 @@ test('import base glob raw', async () => {
     .poll(async () => await page.textContent('.result-base'))
     .toBe(JSON.stringify(baseRawResult, null, 2))
 })
+
+test('import.meta.glob and dynamic import vars transformations should be visible to post transform plugins', async () => {
+  await expect
+    .poll(async () => await page.textContent('.transform-visibility'))
+    .toBe(
+      JSON.stringify({ globTransformed: true, dynamicImportTransformed: true }),
+    )
+})

playground/glob-import/index.html

@@ -205,3 +205,12 @@ <h2>Array Pattern with Exclusions</h2>
     2,
   )
 </script>
+
+<h2>Transform visibility</h2>
+<pre class="transform-visibility"></pre>
+
+<script type="module">
+  import result from './transform-visibility.js'
+  document.querySelector('.transform-visibility').textContent =
+    JSON.stringify(result)
+</script>

playground/glob-import/transform-visibility.js

@@ -0,0 +1,3 @@
+const name = 'foo'
+export const globResult = import.meta.glob('./dir/*.js')
+export const dynamicResult = import(`./dir/${name}.js`)

playground/glob-import/vite.config.ts

@@ -14,7 +14,22 @@ const escapeAliases = fs
     return aliases
   }, {})
 
+const transformVisibilityPlugin = {
+  name: 'test:transform-visibility',
+  enforce: 'post',
+  transform(code: string, id: string) {
+    if (id.endsWith('transform-visibility.js')) {
+      const globTransformed = !code.includes('import.meta.glob')
+      const dynamicImportTransformed = code.includes(
+        '__variableDynamicImportRuntimeHelper',
+      )
+      return `export default ${JSON.stringify({ globTransformed, dynamicImportTransformed })}`
+    }
+  },
+}
+
 export default defineConfig({
+  plugins: [transformVisibilityPlugin],
   resolve: {
     alias: {
       ...escapeAliases,