fix(optimizer): browser mapping for yarn pnp

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

@@ -68,6 +68,24 @@ export function esbuildDepPlugin(
     return resolver(id, _importer, undefined, ssr)
   }
 
+  const resolveResult = (id: string, resolved: string) => {
+    if (resolved.startsWith(browserExternalId)) {
+      return {
+        path: id,
+        namespace: 'browser-external'
+      }
+    }
+    if (isExternalUrl(resolved)) {
+      return {
+        path: resolved,
+        external: true
+      }
+    }
+    return {
+      path: path.resolve(resolved)
+    }
+  }
+
   return {
     name: 'vite:dep-pre-bundle',
     setup(build) {
@@ -122,21 +140,7 @@ export function esbuildDepPlugin(
           // use vite's own resolver
           const resolved = await resolve(id, importer, kind)
           if (resolved) {
-            if (resolved.startsWith(browserExternalId)) {
-              return {
-                path: id,
-                namespace: 'browser-external'
-              }
-            }
-            if (isExternalUrl(resolved)) {
-              return {
-                path: resolved,
-                external: true
-              }
-            }
-            return {
-              path: path.resolve(resolved)
-            }
+            return resolveResult(id, resolved)
           }
         }
       )
@@ -190,30 +194,31 @@ export function esbuildDepPlugin(
         }
       })
 
-      build.onLoad(
-        { filter: /.*/, namespace: 'browser-external' },
-        ({ path: id }) => {
-          return {
-            contents:
-              `export default new Proxy({}, {
-  get() {
-    throw new Error('Module "${id}" has been externalized for ` +
-              `browser compatibility and cannot be accessed in client code.')
-  }
-})`
-          }
-        }
-      )
-
       // yarn 2 pnp compat
       if (isRunningWithYarnPnp) {
         build.onResolve(
           { filter: /.*/ },
-          async ({ path, importer, kind, resolveDir }) => ({
-            // pass along resolveDir for entries
-            path: await resolve(path, importer, kind, resolveDir)
-          })
+          async ({ path: id, importer, kind, resolveDir, namespace }) => {
+            const resolved = await resolve(
+              id,
+              importer,
+              kind,
+              // pass along resolveDir for entries
+              namespace === 'dep' ? resolveDir : undefined
+            )
+            if (resolved) {
+              return resolveResult(id, resolved)
+            }
+          }
         )
+
+        // Without pnp esbuild is transforming modules disabled for the browser
+        // to empty CommonJS modules. In pnp mode we achieve the same by passing
+        // empty contents causing esbuild to produce an empty CommonJS module.
+        build.onLoad({ filter: /.*/, namespace: 'browser-external' }, () => {
+          return { contents: '' }
+        })
+
         build.onLoad({ filter: /.*/ }, async (args) => ({
           contents: await require('fs').promises.readFile(args.path),
           loader: 'default'