Promote and rename server bundling options `serverComponentsExternalPackages` and `bundlePagesExternals` #65421

Ethan-Arrowood · 2024-05-06T18:45:47Z

This PR promotes and renames experimental configuration options related to server bundling:

serverComponentsExternalPackages -> serverExternalPackages
bundlePagesExternals -> bundlePagesRouterDependencies

Existing docs for serverComponentsExternalPackages was changed.
New docs for bundlePagesRouterDependencies were added.

Closes NEXT-3332

…ternals

github-actions · 2024-05-06T18:53:13Z

All broken links are now fixed, thank you!

ijjk · 2024-05-06T18:56:16Z

Tests Passed

ijjk · 2024-05-06T19:18:13Z

Stats from current PR

Default Build (Increase detected ⚠️)

General

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
buildDuration	19.1s	16.3s	N/A
buildDurationCached	9.3s	7.9s	N/A
nodeModulesSize	345 MB	345 MB	N/A
nextStartRea..uration (ms)	445ms	449ms	N/A

Client Bundles (main, webpack)

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
2262-HASH.js gzip	5.06 kB	5.05 kB	N/A
69089819-HASH.js gzip	50.8 kB	50.8 kB	N/A
7522.HASH.js gzip	169 B	169 B	✓
9921-HASH.js gzip	33.6 kB	33.6 kB	N/A
framework-HASH.js gzip	55.8 kB	55.8 kB	N/A
main-app-HASH.js gzip	228 B	228 B	✓
main-HASH.js gzip	32.3 kB	32.3 kB	N/A
webpack-HASH.js gzip	1.71 kB	1.7 kB	N/A
Overall change	397 B	397 B	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
_app-HASH.js gzip	191 B	193 B	N/A
_error-HASH.js gzip	192 B	192 B	✓
amp-HASH.js gzip	510 B	511 B	N/A
css-HASH.js gzip	341 B	342 B	N/A
dynamic-HASH.js gzip	2.52 kB	2.52 kB	N/A
edge-ssr-HASH.js gzip	266 B	265 B	N/A
head-HASH.js gzip	365 B	365 B	✓
hooks-HASH.js gzip	392 B	392 B	✓
image-HASH.js gzip	4.27 kB	4.27 kB	N/A
index-HASH.js gzip	268 B	268 B	✓
link-HASH.js gzip	2.69 kB	2.69 kB	N/A
routerDirect..HASH.js gzip	327 B	329 B	N/A
script-HASH.js gzip	392 B	396 B	N/A
withRouter-HASH.js gzip	324 B	324 B	✓
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	1.65 kB	1.65 kB	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
_buildManifest.js gzip	483 B	485 B	N/A
Overall change	0 B	0 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
index.html gzip	528 B	529 B	N/A
link.html gzip	541 B	544 B	N/A
withRouter.html gzip	522 B	524 B	N/A
Overall change	0 B	0 B	✓

Edge SSR bundle Size

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
edge-ssr.js gzip	120 kB	120 kB	N/A
page.js gzip	180 kB	180 kB	N/A
Overall change	0 B	0 B	✓

Middleware size

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
middleware-b..fest.js gzip	625 B	626 B	N/A
middleware-r..fest.js gzip	156 B	156 B	✓
middleware.js gzip	25.7 kB	25.7 kB	N/A
edge-runtime..pack.js gzip	839 B	839 B	✓
Overall change	995 B	995 B	✓

Next Runtimes

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
app-page-exp...dev.js gzip	174 kB	174 kB	✓
app-page-exp..prod.js gzip	106 kB	106 kB	✓
app-page-tur..prod.js gzip	115 kB	115 kB	✓
app-page-tur..prod.js gzip	95 kB	95 kB	✓
app-page.run...dev.js gzip	160 kB	160 kB	✓
app-page.run..prod.js gzip	93.6 kB	93.6 kB	✓
app-route-ex...dev.js gzip	20.9 kB	20.9 kB	✓
app-route-ex..prod.js gzip	15 kB	15 kB	✓
app-route-tu..prod.js gzip	15 kB	15 kB	✓
app-route-tu..prod.js gzip	14.8 kB	14.8 kB	✓
app-route.ru...dev.js gzip	20.7 kB	20.7 kB	✓
app-route.ru..prod.js gzip	14.8 kB	14.8 kB	✓
pages-api-tu..prod.js gzip	9.55 kB	9.55 kB	✓
pages-api.ru...dev.js gzip	9.82 kB	9.82 kB	✓
pages-api.ru..prod.js gzip	9.55 kB	9.55 kB	✓
pages-turbo...prod.js gzip	21.5 kB	21.5 kB	✓
pages.runtim...dev.js gzip	22 kB	22 kB	✓
pages.runtim..prod.js gzip	21.4 kB	21.4 kB	✓
server.runti..prod.js gzip	51.8 kB	51.8 kB	✓
Overall change	990 kB	990 kB	✓

build cache Overall increase ⚠️

	vercel/next.js canary	vercel/next.js promote-server-bundling-options	Change
0.pack gzip	1.63 MB	1.63 MB	⚠️ +479 B
index.pack gzip	118 kB	117 kB	N/A
Overall change	1.63 MB	1.63 MB	⚠️ +479 B

Diff details

Diff for page.js

Diff too large to display

Diff for middleware.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for image-HASH.js

@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [8358],
   {
-    /***/ 5497: /***/ (
+    /***/ 2307: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -9,7 +9,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/image",
         function () {
-          return __webpack_require__(7374);
+          return __webpack_require__(6812);
         },
       ]);
       if (false) {
@@ -18,7 +18,7 @@
       /***/
     },
 
-    /***/ 3508: /***/ (module, exports, __webpack_require__) => {
+    /***/ 6470: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -40,15 +40,15 @@
         __webpack_require__(5439)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(8279)
+        __webpack_require__(5691)
       );
-      const _getimgprops = __webpack_require__(1598);
-      const _imageconfig = __webpack_require__(134);
-      const _imageconfigcontextsharedruntime = __webpack_require__(7837);
-      const _warnonce = __webpack_require__(8099);
-      const _routercontextsharedruntime = __webpack_require__(7475);
+      const _getimgprops = __webpack_require__(2069);
+      const _imageconfig = __webpack_require__(8526);
+      const _imageconfigcontextsharedruntime = __webpack_require__(2608);
+      const _warnonce = __webpack_require__(8309);
+      const _routercontextsharedruntime = __webpack_require__(4990);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(9190)
+        __webpack_require__(7291)
       );
       // This is replaced by webpack define plugin
       const configEnv = {
@@ -376,7 +376,7 @@
       /***/
     },
 
-    /***/ 1598: /***/ (
+    /***/ 2069: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -392,9 +392,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(8099);
-      const _imageblursvg = __webpack_require__(6874);
-      const _imageconfig = __webpack_require__(134);
+      const _warnonce = __webpack_require__(8309);
+      const _imageblursvg = __webpack_require__(7976);
+      const _imageconfig = __webpack_require__(8526);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -769,7 +769,7 @@
       /***/
     },
 
-    /***/ 6874: /***/ (__unused_webpack_module, exports) => {
+    /***/ 7976: /***/ (__unused_webpack_module, exports) => {
       "use strict";
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
@@ -824,7 +824,7 @@
       /***/
     },
 
-    /***/ 2028: /***/ (
+    /***/ 4186: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -851,10 +851,10 @@
         },
       });
       const _interop_require_default = __webpack_require__(1478);
-      const _getimgprops = __webpack_require__(1598);
-      const _imagecomponent = __webpack_require__(3508);
+      const _getimgprops = __webpack_require__(2069);
+      const _imagecomponent = __webpack_require__(6470);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(9190)
+        __webpack_require__(7291)
       );
       function getImageProps(imgProps) {
         const { props } = (0, _getimgprops.getImgProps)(imgProps, {
@@ -886,7 +886,7 @@
       /***/
     },
 
-    /***/ 9190: /***/ (__unused_webpack_module, exports) => {
+    /***/ 7291: /***/ (__unused_webpack_module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -921,7 +921,7 @@
       /***/
     },
 
-    /***/ 7374: /***/ (
+    /***/ 6812: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -938,8 +938,8 @@
 
       // EXTERNAL MODULE: ./node_modules/.pnpm/react@19.0.0-beta-4508873393-20240430/node_modules/react/jsx-runtime.js
       var jsx_runtime = __webpack_require__(3456);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-beta-4508873393-20240430_rea_65yyqpgvftv4sckwrae5ytuiki/node_modules/next/image.js
-      var next_image = __webpack_require__(5008);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-beta-4508873393-20240430_rea_bi4li5t763kdoqq4snruxkmfcu/node_modules/next/image.js
+      var next_image = __webpack_require__(932);
       var image_default = /*#__PURE__*/ __webpack_require__.n(next_image); // CONCATENATED MODULE: ./pages/nextjs.png
       /* harmony default export */ const nextjs = {
         src: "/_next/static/media/nextjs.cae0b805.png",
@@ -969,12 +969,12 @@
       /***/
     },
 
-    /***/ 5008: /***/ (
+    /***/ 932: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(2028);
+      module.exports = __webpack_require__(4186);
 
       /***/
     },
@@ -984,7 +984,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [2888, 9774, 179], () =>
-      __webpack_exec__(5497)
+      __webpack_exec__(2307)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;

Commit: 7aad5cf

imranbarbhuiya · 2024-05-07T08:53:48Z

docs/03-pages/02-api-reference/03-next-config-js/serverExternalPackages.mdx

+```
+
+Next.js includes a [short list of popular packages](https://github.com/vercel/next.js/blob/canary/packages/next/src/lib/server-external-packages.json) that currently are working on compatibility and automatically opt-ed out:
+


since it's an mdx file so u can import the json file where these deps names are written and map to display it here. This way both the lists will stay synced

I'd consider that out of scope for this PR. We have the validate script that manages it for now. It'd be a good follow up change!

eps1lon · 2024-05-07T17:03:49Z

Do we have this enabled on Front already?

Ethan-Arrowood · 2024-05-07T17:08:07Z

These options are in use on Vercel Site. When this merges I will update the corresponding config files

ForsakenHarmony · 2024-05-07T17:22:55Z

packages/next-swc/crates/next-core/src/next_config.rs

@@ -120,6 +120,9 @@ pub struct NextConfig {
    typescript: TypeScriptConfig,
    use_file_system_public_routes: bool,
    webpack: Option<serde_json::Value>,
+    /// A list of packages that should be treated as external in the RSC server


this comment probably needs to be changed

ForsakenHarmony · 2024-05-07T17:23:16Z

packages/next/src/server/config-shared.ts

+  bundlePagesRouterDependencies?: boolean
+
+  /**
+   * A list of packages that should be treated as external in the RSC server build.


this comment needs to be changed

…5575) Follow up to #65421 This pr re-adds the old experimental options to the type definition and adds proper warnings in the config resolver.

…rcel#65575) Follow up to vercel#65421 This pr re-adds the old experimental options to the type definition and adds proper warnings in the config resolver.

Ethan-Arrowood added 2 commits May 6, 2024 12:43

promote and rename serverComponentsExternalPackages and bundlePagesEx…

bd9384f

…ternals

fix doc link

8f6d47b

ijjk added created-by: Next.js team PRs by the Next.js team. Documentation Related to Next.js' official documentation. tests Turbopack Related to Turbopack with Next.js. type: next labels May 6, 2024

add docs

69a45f8

Ethan-Arrowood added 6 commits May 6, 2024 12:58

fix validate-externals-doc script

ea14a9d

update turbopack manifests

333dc5d

fix links?

a907762

Merge branch 'canary' into promote-server-bundling-options

617e75c

more fixes

f111e93

fix links

f4952bc

Ethan-Arrowood marked this pull request as ready for review May 6, 2024 19:07

Ethan-Arrowood requested review from timneutkens, ijjk, shuding, huozhi, a team, ztanner, feedthejim and wyattjoh as code owners May 6, 2024 19:07

Ethan-Arrowood requested review from timeyoutakeit and leerob and removed request for a team May 6, 2024 19:07

Ethan-Arrowood added 2 commits May 6, 2024 14:03

Merge branch 'canary' into promote-server-bundling-options

eeb3636

Merge branch 'canary' into promote-server-bundling-options

1ace1e3

imranbarbhuiya suggested changes May 7, 2024

View reviewed changes

Ethan-Arrowood added 2 commits May 7, 2024 10:07

Merge branch 'canary' into promote-server-bundling-options

e0484ee

fix swc

7aad5cf

eps1lon approved these changes May 7, 2024

View reviewed changes

Ethan-Arrowood merged commit d0d22ac into canary May 7, 2024
74 of 80 checks passed

Ethan-Arrowood deleted the promote-server-bundling-options branch May 7, 2024 17:19

ForsakenHarmony reviewed May 7, 2024

View reviewed changes

Ethan-Arrowood mentioned this pull request May 9, 2024

Add proper deprecation/rename warnings for server bundling option #65575

Merged

github-actions bot added the locked label May 22, 2024

github-actions bot locked as resolved and limited conversation to collaborators May 22, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Promote and rename server bundling options `serverComponentsExternalPackages` and `bundlePagesExternals` #65421

Promote and rename server bundling options `serverComponentsExternalPackages` and `bundlePagesExternals` #65421

Ethan-Arrowood commented May 6, 2024 •

edited by padmaia

Loading

github-actions bot commented May 6, 2024 •

edited

Loading

ijjk commented May 6, 2024 •

edited

Loading

ijjk commented May 6, 2024 •

edited

Loading

imranbarbhuiya May 7, 2024

Ethan-Arrowood May 7, 2024

eps1lon commented May 7, 2024

Ethan-Arrowood commented May 7, 2024

ForsakenHarmony May 7, 2024

ForsakenHarmony May 7, 2024

		```

		Next.js includes a [short list of popular packages](https://github.com/vercel/next.js/blob/canary/packages/next/src/lib/server-external-packages.json) that currently are working on compatibility and automatically opt-ed out:

Promote and rename server bundling options serverComponentsExternalPackages and bundlePagesExternals #65421

Promote and rename server bundling options serverComponentsExternalPackages and bundlePagesExternals #65421

Conversation

Ethan-Arrowood commented May 6, 2024 • edited by padmaia Loading

github-actions bot commented May 6, 2024 • edited Loading

ijjk commented May 6, 2024 • edited Loading

Tests Passed

ijjk commented May 6, 2024 • edited Loading

Stats from current PR

imranbarbhuiya May 7, 2024

Choose a reason for hiding this comment

Ethan-Arrowood May 7, 2024

Choose a reason for hiding this comment

eps1lon commented May 7, 2024

Ethan-Arrowood commented May 7, 2024

ForsakenHarmony May 7, 2024

Choose a reason for hiding this comment

ForsakenHarmony May 7, 2024

Choose a reason for hiding this comment

Promote and rename server bundling options `serverComponentsExternalPackages` and `bundlePagesExternals` #65421

Promote and rename server bundling options `serverComponentsExternalPackages` and `bundlePagesExternals` #65421

Ethan-Arrowood commented May 6, 2024 •

edited by padmaia

Loading

github-actions bot commented May 6, 2024 •

edited

Loading

ijjk commented May 6, 2024 •

edited

Loading

ijjk commented May 6, 2024 •

edited

Loading