From 028b8d040dd4b6467635cdfbd90ea711f430f590 Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Fri, 11 Nov 2022 01:50:46 +0100
Subject: [PATCH] Fix resolving for esm package with only exports.import
 condition (#42767)

Should be able to resolve `exports.import` condition for esm packages only when import them in server components

Fixes: #42534

## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`
---
 packages/next/build/webpack-config.ts                      | 6 ++----
 test/e2e/app-dir/app-external.test.ts                      | 4 ++--
 .../app-external/app/external-imports/server/page.js       | 2 +-
 .../app-external/components/random-module-instance.js      | 2 +-
 .../{random-module-instance => pure-esm-module}/index.js   | 2 +-
 .../node_modules_bak/pure-esm-module/package.json          | 7 +++++++
 .../node_modules_bak/random-module-instance/package.json   | 5 -----
 test/e2e/app-dir/rsc-basic/app/shared/page.js              | 1 -
 8 files changed, 14 insertions(+), 15 deletions(-)
 rename test/e2e/app-dir/app-external/node_modules_bak/{random-module-instance => pure-esm-module}/index.js (50%)
 create mode 100644 test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/package.json
 delete mode 100644 test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/package.json

diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
index 8cfdbb20cecdb5b..a47ea333684a834 100644
--- a/packages/next/build/webpack-config.ts
+++ b/packages/next/build/webpack-config.ts
@@ -1641,7 +1641,7 @@ export default async function getBaseWebpackConfig(
                   return true
                 },
                 resolve: {
-                  conditionNames: ['react-server', 'node', 'require'],
+                  conditionNames: ['react-server', 'node', 'import', 'require'],
                   alias: {
                     // If missing the alias override here, the default alias will be used which aliases
                     // react to the direct file path, not the package name. In that case the condition
@@ -1983,9 +1983,7 @@ export default async function getBaseWebpackConfig(
         new ReactLoadablePlugin({
           filename: REACT_LOADABLE_MANIFEST,
           pagesDir,
-          runtimeAsset: true
-            ? `server/${MIDDLEWARE_REACT_LOADABLE_MANIFEST}.js`
-            : undefined,
+          runtimeAsset: `server/${MIDDLEWARE_REACT_LOADABLE_MANIFEST}.js`,
           dev,
         }),
       (isClient || isEdgeServer) && new DropClientPage(),
diff --git a/test/e2e/app-dir/app-external.test.ts b/test/e2e/app-dir/app-external.test.ts
index becf667a7140bc7..f80c78aacc879d1 100644
--- a/test/e2e/app-dir/app-external.test.ts
+++ b/test/e2e/app-dir/app-external.test.ts
@@ -90,9 +90,9 @@ describe('app dir - external dependency', () => {
     containClientContent(browserClientText)
 
     // support esm module imports on server side, and indirect imports from shared components
-    expect(serverHtml).toContain('random-module-instance')
+    expect(serverHtml).toContain('pure-esm-module')
     expect(sharedHtml).toContain(
-      'node_modules instance from client module random-module-instance'
+      'node_modules instance from client module pure-esm-module'
     )
   })
 
diff --git a/test/e2e/app-dir/app-external/app/external-imports/server/page.js b/test/e2e/app-dir/app-external/app/external-imports/server/page.js
index 902dee4d2549180..f28f309b74bb8f4 100644
--- a/test/e2e/app-dir/app-external/app/external-imports/server/page.js
+++ b/test/e2e/app-dir/app-external/app/external-imports/server/page.js
@@ -1,4 +1,4 @@
-import { name } from 'random-module-instance'
+import { name } from 'pure-esm-module'
 
 export default function Page() {
   return (
diff --git a/test/e2e/app-dir/app-external/components/random-module-instance.js b/test/e2e/app-dir/app-external/components/random-module-instance.js
index 29a407eaef6b5eb..3b8e0496319a85e 100644
--- a/test/e2e/app-dir/app-external/components/random-module-instance.js
+++ b/test/e2e/app-dir/app-external/components/random-module-instance.js
@@ -1,6 +1,6 @@
 'use client'
 
-import { name } from 'random-module-instance'
+import { name } from 'pure-esm-module'
 
 export default function () {
   return `node_modules instance from client module ${name}`
diff --git a/test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/index.js b/test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/index.js
similarity index 50%
rename from test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/index.js
rename to test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/index.js
index 5b16eaa49443754..e8d8aece913effa 100644
--- a/test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/index.js
+++ b/test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/index.js
@@ -1,2 +1,2 @@
 export const random = ~~(Math.random() * 1e5)
-export const name = 'random-module-instance'
+export const name = 'pure-esm-module'
diff --git a/test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/package.json b/test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/package.json
new file mode 100644
index 000000000000000..5e19d0f7c55f58f
--- /dev/null
+++ b/test/e2e/app-dir/app-external/node_modules_bak/pure-esm-module/package.json
@@ -0,0 +1,7 @@
+{
+  "name": "pure-esm-module",
+  "type": "module",
+  "exports": {
+    "import": "./index.js"
+  }
+}
diff --git a/test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/package.json b/test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/package.json
deleted file mode 100644
index d34ce9aac07c12d..000000000000000
--- a/test/e2e/app-dir/app-external/node_modules_bak/random-module-instance/package.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-  "name": "random-module-instance",
-  "type": "module",
-  "exports": "./index.js"
-}
diff --git a/test/e2e/app-dir/rsc-basic/app/shared/page.js b/test/e2e/app-dir/rsc-basic/app/shared/page.js
index c0f3712250cbd53..56bfb4075272a10 100644
--- a/test/e2e/app-dir/rsc-basic/app/shared/page.js
+++ b/test/e2e/app-dir/rsc-basic/app/shared/page.js
@@ -1,7 +1,6 @@
 import ClientFromDirect from '../../components/client'
 import ClientFromShared from '../../components/shared'
 import SharedFromClient from '../../components/shared-client'
-// import Random from '../../components/random-module-instance'
 import Bar from '../../components/bar'
 
 export default function Page() {