Only import dev overlay for dev mode

import dev overlay on dev
vercel · Oct 25, 2022 · cf54007 · cf54007
1 parent e107bc4
commit cf54007
Show file tree

Hide file tree

Showing 7 changed files with 16 additions and 13 deletions.
diff --git a/packages/next/build/entries.ts b/packages/next/build/entries.ts
@@ -527,7 +527,6 @@ export function finalizeEntrypoint({
         ...entry,
       }
     }
-
     return {
       dependOn:
         name.startsWith('pages/') && name !== 'pages/_app'

diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
@@ -1618,7 +1618,7 @@ export default async function getBaseWebpackConfig(
     },
     module: {
       rules: [
-        ...(hasAppDir && !isClient && !isEdgeServer
+        ...(hasAppDir && !isClient
           ? [
               {
                 issuerLayer: WEBPACK_LAYERS.server,
@@ -1643,7 +1643,7 @@ export default async function getBaseWebpackConfig(
                     // 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
                     // will be ignored completely.
-                    react: 'next/dist/compiled/react',
+                    react: 'next/dist/compiled/react/react.shared-subset',
                     'react-dom$':
                       'next/dist/compiled/react-dom/server-rendering-stub',
                   },

diff --git a/packages/next/build/webpack/plugins/flight-client-entry-plugin.ts b/packages/next/build/webpack/plugins/flight-client-entry-plugin.ts
@@ -231,7 +231,7 @@ export class FlightClientEntryPlugin {
 
       function collectModule(entryName: string, mod: any) {
         const resource = mod.resource
-        const modId = resource // compilation.chunkGraph.getModuleId(mod) + ''
+        const modId = resource
         if (modId) {
           if (regexCSS.test(modId)) {
             cssImportsForChunk[entryName].push(modId)
@@ -361,9 +361,8 @@ export class FlightClientEntryPlugin {
         !rawRequest.startsWith(APP_DIR_ALIAS)
 
       const modRequest: string | undefined = isLocal
-        ? rawRequest // compilation.chunkGraph.getModuleId(mod) + ''
+        ? rawRequest
         : mod.resourceResolveData?.path + mod.resourceResolveData?.query
-      // console.log('modId:after', modRequest)
 
       // Ensure module is not walked again if it's already been visited
       if (!visitedBySegment[layoutOrPageRequest]) {

diff --git a/packages/next/build/webpack/plugins/flight-manifest-plugin.ts b/packages/next/build/webpack/plugins/flight-manifest-plugin.ts
@@ -186,10 +186,8 @@ export class FlightManifestPlugin {
           context,
           mod.resourceResolveData?.path || resource
         )
-        // if (resource.includes('script'))
-        //   console.log('ssrNamedModuleId', ssrNamedModuleId, modId)
+
         if (!ssrNamedModuleId.startsWith('.'))
-          // TODO use getModuleId instead
           ssrNamedModuleId = `./${ssrNamedModuleId.replace(/\\/g, '/')}`
 
         if (isCSSModule) {

diff --git a/packages/next/client/app-index.tsx b/packages/next/client/app-index.tsx
@@ -7,7 +7,6 @@ import { createFromReadableStream } from 'next/dist/compiled/react-server-dom-we
 
 import measureWebVitals from './performance-relayer'
 import { HeadManagerContext } from '../shared/lib/head-manager-context'
-import HotReload from './components/react-dev-overlay/hot-reloader-client'
 import { GlobalLayoutRouterContext } from '../shared/lib/app-router-context'
 
 /// <reference types="react-dom/experimental" />
@@ -176,6 +175,8 @@ function RSCComponent(props: any): JSX.Element {
 
 export function hydrate() {
   if (process.env.NODE_ENV !== 'production') {
+    const HotReload = require('./components/react-dev-overlay/hot-reloader-client')
+    typeof import('./components/react-dev-overlay/hot-reloader-client')
     const rootLayoutMissingTagsError = (self as any)
       .__next_root_layout_missing_tags_error
 

diff --git a/test/.stats-app/app/app-edge-ssr/page.js b/test/.stats-app/app/app-edge-ssr/page.js
@@ -2,6 +2,4 @@ export default function page() {
   return 'edge-ssr'
 }
 
-export const config = {
-  runtime: 'experimental-edge',
-}
+export const runtime = 'experimental-edge'
diff --git a/test/.stats-app/next.config.js b/test/.stats-app/next.config.js
@@ -3,3 +3,11 @@ module.exports = {
     appDir: true,
   },
 }
+
+// For development: analyze the bundled chunks for stats app
+if (process.env.ANALYZE) {
+  const withBundleAnalyzer = require('@next/bundle-analyzer')({
+    enabled: true,
+  })
+  module.exports = withBundleAnalyzer(module.exports)
+}