fix: transform import.meta.glob when scan JS/TS #10634 (#10635)

Author: candy-Tong

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

@@ -200,6 +200,29 @@ function esbuildScanPlugin(
     external: !entries.includes(path)
   })
 
+  const doTransformGlobImport = async (
+    contents: string,
+    id: string,
+    loader: Loader
+  ) => {
+    let transpiledContents
+    // transpile because `transformGlobImport` only expects js
+    if (loader !== 'js') {
+      transpiledContents = (await transform(contents, { loader })).code
+    } else {
+      transpiledContents = contents
+    }
+
+    const result = await transformGlobImport(
+      transpiledContents,
+      id,
+      config.root,
+      resolve
+    )
+
+    return result?.s.toString() || transpiledContents
+  }
+
   return {
     name: 'vite:dep-scan',
     setup(build) {
@@ -305,26 +328,9 @@ function esbuildScanPlugin(
 
               const key = `${path}?id=${scriptId++}`
               if (contents.includes('import.meta.glob')) {
-                let transpiledContents
-                // transpile because `transformGlobImport` only expects js
-                if (loader !== 'js') {
-                  transpiledContents = (await transform(contents, { loader }))
-                    .code
-                } else {
-                  transpiledContents = contents
-                }
-
                 scripts[key] = {
                   loader: 'js', // since it is transpiled
-                  contents:
-                    (
-                      await transformGlobImport(
-                        transpiledContents,
-                        path,
-                        config.root,
-                        resolve
-                      )
-                    )?.s.toString() || transpiledContents,
+                  contents: await doTransformGlobImport(contents, path, loader),
                   pluginData: {
                     htmlType: { loader }
                   }
@@ -481,7 +487,7 @@ function esbuildScanPlugin(
       // for jsx/tsx, we need to access the content and check for
       // presence of import.meta.glob, since it results in import relationships
       // but isn't crawled by esbuild.
-      build.onLoad({ filter: JS_TYPES_RE }, ({ path: id }) => {
+      build.onLoad({ filter: JS_TYPES_RE }, async ({ path: id }) => {
         let ext = path.extname(id).slice(1)
         if (ext === 'mjs') ext = 'js'
 
@@ -494,6 +500,13 @@ function esbuildScanPlugin(
           config.optimizeDeps?.esbuildOptions?.loader?.[`.${ext}`] ||
           (ext as Loader)
 
+        if (contents.includes('import.meta.glob')) {
+          return {
+            loader: 'js', // since it is transpiled,
+            contents: await doTransformGlobImport(contents, id, loader)
+          }
+        }
+
         return {
           loader,
           contents