diff --git a/packages/next/src/build/handle-externals.ts b/packages/next/src/build/handle-externals.ts
index 4457155ce5720..a52f9dea1a021 100644
--- a/packages/next/src/build/handle-externals.ts
+++ b/packages/next/src/build/handle-externals.ts
@@ -301,8 +301,10 @@ export function makeExternalHandler({
       return resolveResult.localRes
     }
 
-    if (request === 'styled-jsx/style' && !isAppLayer) {
-      return `commonjs ${defaultOverrides['styled-jsx/style']}`
+    // Forcedly resolve the styled-jsx installed by next.js,
+    // since `resolveExternal` cannot find the styled-jsx dep with pnpm
+    if (request === 'styled-jsx/style') {
+      resolveResult.res = defaultOverrides['styled-jsx/style']
     }
 
     const { res, isEsm } = resolveResult