From b8e32d2b9b550ef8ad05bcd1d141093c19c9f5c5 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Fri, 14 Oct 2022 15:08:48 +0200 Subject: [PATCH] Remove edge shared deps (#41413) Since we have already bundled dependencies for server layer, so the shared deps chunk group is not needed anymore. Also changing to esm assets import with next internals for edge function and middleware build. The changes are originally from #41337, try to land them separately. --- packages/next/build/entries.ts | 5 +- packages/next/build/webpack-config.ts | 49 +++++-------------- .../loaders/next-edge-function-loader.ts | 2 +- .../loaders/next-edge-ssr-loader/index.ts | 2 +- .../webpack/loaders/next-middleware-loader.ts | 2 +- packages/next/lib/constants.ts | 1 - 6 files changed, 18 insertions(+), 43 deletions(-) diff --git a/packages/next/build/entries.ts b/packages/next/build/entries.ts index b01a29b94d896..601f4f85b40be 100644 --- a/packages/next/build/entries.ts +++ b/packages/next/build/entries.ts @@ -209,7 +209,10 @@ export function getEdgeServerEntry(opts: { return { import: `next-edge-ssr-loader?${stringify(loaderParams)}!`, - layer: opts.isServerComponent ? WEBPACK_LAYERS.server : undefined, + // The Edge bundle includes the server in its entrypoint, so it has to + // be in the SSR layer — we later convert the page request to the RSC layer + // via a webpack rule. + layer: undefined, } } diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts index f123926bd125c..61b12d4a99adb 100644 --- a/packages/next/build/webpack-config.ts +++ b/packages/next/build/webpack-config.ts @@ -86,9 +86,6 @@ const BABEL_CONFIG_FILES = [ 'babel.config.cjs', ] -const rscSharedRegex = - /(node_modules[\\/]react\/|[\\/]shared[\\/]lib[\\/](head-manager-context|router-context|server-inserted-html)\.js|node_modules[\\/]styled-jsx[\\/])/ - // Support for NODE_PATH const nodePathList = (process.env.NODE_PATH || '') .split(process.platform === 'win32' ? ';' : ':') @@ -1310,39 +1307,18 @@ export default async function getBaseWebpackConfig( ...(config.experimental.optimizeCss ? [] : ['critters']), ], optimization: { - // @ts-ignore: TODO remove ts-ignore when webpack 4 is removed emitOnErrors: !dev, checkWasmTypes: false, nodeEnv: false, splitChunks: ((): | Required['optimization']['splitChunks'] | false => { - // For the edge runtime, we have to bundle all dependencies inside without dynamic `require`s. - // To make some dependencies like `react` to be shared between entrypoints, we use a special - // cache group here even under dev mode. - const edgeRSCCacheGroups = hasServerComponents - ? { - rscDeps: { - enforce: true, - name: 'rsc-runtime-deps', - filename: 'rsc-runtime-deps.js', - test: rscSharedRegex, - }, - } - : undefined - if (isEdgeServer && edgeRSCCacheGroups) { - return { - cacheGroups: edgeRSCCacheGroups, - } - } - if (dev) { return false } if (isNodeServer) { return { - // @ts-ignore filename: '[name].js', chunks: 'all', minSize: 1000, @@ -1351,11 +1327,8 @@ export default async function getBaseWebpackConfig( if (isEdgeServer) { return { - // @ts-ignore filename: 'edge-chunks/[name].js', - chunks: 'all', minChunks: 2, - cacheGroups: edgeRSCCacheGroups, } } @@ -1471,7 +1444,6 @@ export default async function getBaseWebpackConfig( }, context: dir, // Kept as function to be backwards compatible - // @ts-ignore TODO webpack 5 typings needed entry: async () => { return { ...(clientEntries ? clientEntries : {}), @@ -1599,6 +1571,17 @@ export default async function getBaseWebpackConfig( } as any, ] : []), + ...(hasAppDir && isEdgeServer + ? [ + // The Edge bundle includes the server in its entrypoint, so it has to + // be in the SSR layer — here we convert the actual page request to + // the RSC layer via a webpack rule. + { + resourceQuery: /__edge_ssr_entry__/, + layer: WEBPACK_LAYERS.server, + }, + ] + : []), // Alias `next/dynamic` to React.lazy implementation for RSC ...(hasServerComponents ? [ @@ -1631,16 +1614,6 @@ export default async function getBaseWebpackConfig( }, ] : []), - ...(hasServerComponents && isEdgeServer - ? [ - // Move shared dependencies from sc_server and sc_client into the - // same layer. - { - test: rscSharedRegex, - layer: WEBPACK_LAYERS.rscShared, - }, - ] - : []), { test: /\.(js|cjs|mjs)$/, issuerLayer: WEBPACK_LAYERS.api, diff --git a/packages/next/build/webpack/loaders/next-edge-function-loader.ts b/packages/next/build/webpack/loaders/next-edge-function-loader.ts index ba56808f47c4a..9b82f5c482542 100644 --- a/packages/next/build/webpack/loaders/next-edge-function-loader.ts +++ b/packages/next/build/webpack/loaders/next-edge-function-loader.ts @@ -18,7 +18,7 @@ export default function middlewareLoader(this: any) { buildInfo.rootDir = rootDir return ` - import { adapter, enhanceGlobals } from 'next/dist/server/web/adapter' + import { adapter, enhanceGlobals } from 'next/dist/esm/server/web/adapter' enhanceGlobals() diff --git a/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts b/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts index c9a9c12316c3f..010a94f6fa5af 100644 --- a/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts +++ b/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts @@ -85,7 +85,7 @@ export default async function edgeSSRLoader(this: any) { const pageModPath = `${appDirLoader}${stringifiedPagePath.substring( 1, stringifiedPagePath.length - 1 - )}` + )}${isAppDir ? '?__edge_ssr_entry__' : ''}` const transformed = ` import { adapter, enhanceGlobals } from 'next/dist/esm/server/web/adapter' diff --git a/packages/next/build/webpack/loaders/next-middleware-loader.ts b/packages/next/build/webpack/loaders/next-middleware-loader.ts index a7f5e40420d2e..f68c2f71cc771 100644 --- a/packages/next/build/webpack/loaders/next-middleware-loader.ts +++ b/packages/next/build/webpack/loaders/next-middleware-loader.ts @@ -40,7 +40,7 @@ export default function middlewareLoader(this: any) { buildInfo.rootDir = rootDir return ` - import { adapter, blockUnallowedResponse, enhanceGlobals } from 'next/dist/server/web/adapter' + import { adapter, blockUnallowedResponse, enhanceGlobals } from 'next/dist/esm/server/web/adapter' enhanceGlobals() diff --git a/packages/next/lib/constants.ts b/packages/next/lib/constants.ts index f4ab54a87b641..9f9e6dc75fb2b 100644 --- a/packages/next/lib/constants.ts +++ b/packages/next/lib/constants.ts @@ -73,7 +73,6 @@ export const WEBPACK_LAYERS = { server: 'sc_server', client: 'sc_client', api: 'api', - rscShared: 'rsc_shared_deps', middleware: 'middleware', edgeAsset: 'edge-asset', }