From f60ae2261774b8906aa1591ef6605e495651801b Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Thu, 6 Oct 2022 11:45:45 +0200
Subject: [PATCH] Alias next/dynamic to lazy impl for appDir

shorter path
---
 packages/next/build/webpack-config.ts           | 17 ++++++++++++++++-
 .../{shared/dynamic/index.tsx => dynamic.tsx}   |  4 +---
 packages/next/shared/lib/dynamic.tsx            |  2 --
 .../index/dynamic-imports/dynamic-client.js     |  2 +-
 .../index/dynamic-imports/dynamic-server.js     |  2 +-
 5 files changed, 19 insertions(+), 8 deletions(-)
 rename packages/next/client/components/{shared/dynamic/index.tsx => dynamic.tsx} (85%)

diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
index 8a07941359b4e..7773d6c127c2a 100644
--- a/packages/next/build/webpack-config.ts
+++ b/packages/next/build/webpack-config.ts
@@ -1586,13 +1586,28 @@ export default async function getBaseWebpackConfig(
               } as any,
             ]
           : []),
+        // Alias `next/dynamic` to React.lazy implementation for RSC
+        ...(hasServerComponents
+          ? [
+              {
+                test: codeCondition.test,
+                include: [appDir],
+                resolve: {
+                  alias: {
+                    [require.resolve('next/dynamic')]:
+                      'next/dist/client/components/dynamic',
+                  },
+                },
+              },
+            ]
+          : []),
         ...(hasServerComponents && (isNodeServer || isEdgeServer)
           ? [
               // RSC server compilation loaders
               {
                 test: codeCondition.test,
                 include: [
-                  dir,
+                  appDir,
                   // To let the internal client components passing through flight loader
                   /next[\\/]dist/,
                 ],
diff --git a/packages/next/client/components/shared/dynamic/index.tsx b/packages/next/client/components/dynamic.tsx
similarity index 85%
rename from packages/next/client/components/shared/dynamic/index.tsx
rename to packages/next/client/components/dynamic.tsx
index f333b8fef6c24..4c3f9c8278198 100644
--- a/packages/next/client/components/shared/dynamic/index.tsx
+++ b/packages/next/client/components/dynamic.tsx
@@ -15,7 +15,5 @@ export type LoadableComponent<P = {}> = React.ComponentType<P>
 export default function dynamic<P = {}>(
   loader: Loader<P>
 ): React.ComponentType<P> {
-  const LazyLoadable = React.lazy(loader)
-
-  return LazyLoadable
+  return React.lazy(loader)
 }
diff --git a/packages/next/shared/lib/dynamic.tsx b/packages/next/shared/lib/dynamic.tsx
index a3046ba882152..b79caf271dc4f 100644
--- a/packages/next/shared/lib/dynamic.tsx
+++ b/packages/next/shared/lib/dynamic.tsx
@@ -1,5 +1,3 @@
-'client'
-
 import React from 'react'
 import Loadable from './loadable'
 
diff --git a/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-client.js b/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-client.js
index 63dcccc63c1cf..2d0f36e76be8e 100644
--- a/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-client.js
+++ b/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-client.js
@@ -1,6 +1,6 @@
 'client'
 
-import dynamic from 'next/dist/client/components/shared/dynamic'
+import dynamic from 'next/dynamic'
 
 const Dynamic = dynamic(() => import('../text-dynamic-client'))
 
diff --git a/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-server.js b/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-server.js
index 0d9406e90f4a0..665da40efa5d2 100644
--- a/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-server.js
+++ b/test/e2e/app-dir/app/app/dashboard/index/dynamic-imports/dynamic-server.js
@@ -1,4 +1,4 @@
-import dynamic from 'next/dist/client/components/shared/dynamic'
+import dynamic from 'next/dynamic'
 
 const Dynamic = dynamic(() => import('../text-dynamic-server'))