Add internal mode for debugging Next.js core webpack #29254

timneutkens · 2021-09-21T11:22:35Z

Added NEXT_PRIVATE_LOCAL_WEBPACK5 to use the local webpack version for core debugging

This variable is only for use when debugging on the Next.js core framework files, do not use it in Next.js applications as it will always lead to unexpected behavior and reduced performance.

Bug

Related issues linked using fixes #number
Integration tests added
Errors have helpful link attached, see contributing.md

Feature

Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
Related issues linked using fixes #number
Integration tests added
Documentation added
Telemetry added. In case of a feature if it's used or not.
Errors have helpful link attached, see contributing.md

Documentation / Examples

Make sure the linting passes

… debugging

…ck 4

…ll webpack 4" This reverts commit db2606c.

…webpack5-direct-usage-mode

ijjk · 2021-09-21T18:48:09Z

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
buildDuration	14.5s	14.2s	-330ms
buildDurationCached	3.7s	3.6s	-172ms
nodeModulesSize	181 MB	181 MB	⚠️ +1.04 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
/ failed reqs	0	0	✓
/ total time (seconds)	2.999	3.037	⚠️ +0.04
/ avg req/sec	833.56	823.27	⚠️ -10.29
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.521	1.46	-0.06
/error-in-render avg req/sec	1644.02	1712.28	+68.26

Client Bundles (main, webpack, commons)

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
779.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42.2 kB	42.2 kB	✓
main-HASH.js gzip	26.8 kB	26.8 kB	✓
webpack-HASH.js gzip	1.45 kB	1.45 kB	✓
Overall change	70.6 kB	70.6 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
_app-HASH.js gzip	977 B	977 B	✓
_error-HASH.js gzip	194 B	194 B	✓
amp-HASH.js gzip	311 B	311 B	✓
css-HASH.js gzip	328 B	328 B	✓
dynamic-HASH.js gzip	2.67 kB	2.67 kB	✓
head-HASH.js gzip	351 B	351 B	✓
hooks-HASH.js gzip	918 B	918 B	✓
image-HASH.js gzip	4.14 kB	4.14 kB	✓
index-HASH.js gzip	260 B	260 B	✓
link-HASH.js gzip	1.66 kB	1.66 kB	✓
routerDirect..HASH.js gzip	320 B	320 B	✓
script-HASH.js gzip	386 B	386 B	✓
withRouter-HASH.js gzip	319 B	319 B	✓
bb14e60e810b..30f.css gzip	125 B	125 B	✓
Overall change	13 kB	13 kB	✓

Client Build Manifests

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
_buildManifest.js gzip	493 B	493 B	✓
Overall change	493 B	493 B	✓

Rendered Page Sizes

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
index.html gzip	538 B	538 B	✓
link.html gzip	550 B	550 B	✓
withRouter.html gzip	532 B	532 B	✓
Overall change	1.62 kB	1.62 kB	✓

Default Build with SWC (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
buildDuration	7.5s	7.4s	-99ms
buildDurationCached	3.6s	3.4s	-138ms
nodeModulesSize	181 MB	181 MB	⚠️ +1.04 kB

Page Load Tests Overall increase ✓

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
/ failed reqs	0	0	✓
/ total time (seconds)	3.004	2.985	-0.02
/ avg req/sec	832.36	837.5	+5.14
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.513	1.434	-0.08
/error-in-render avg req/sec	1652.2	1743.31	+91.11

Client Bundles (main, webpack, commons)

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
675-HASH.js gzip	13.8 kB	13.8 kB	✓
770.HASH.js gzip	178 B	178 B	✓
framework-HASH.js gzip	50.7 kB	50.7 kB	✓
main-HASH.js gzip	34.7 kB	34.7 kB	✓
webpack-HASH.js gzip	1.65 kB	1.65 kB	✓
Overall change	101 kB	101 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
_app-HASH.js gzip	1.32 kB	1.32 kB	✓
_error-HASH.js gzip	180 B	180 B	✓
amp-HASH.js gzip	315 B	315 B	✓
css-HASH.js gzip	331 B	331 B	✓
dynamic-HASH.js gzip	2.8 kB	2.8 kB	✓
head-HASH.js gzip	356 B	356 B	✓
hooks-HASH.js gzip	637 B	637 B	✓
image-HASH.js gzip	573 B	573 B	✓
index-HASH.js gzip	262 B	262 B	✓
link-HASH.js gzip	2.2 kB	2.2 kB	✓
routerDirect..HASH.js gzip	326 B	326 B	✓
script-HASH.js gzip	393 B	393 B	✓
withRouter-HASH.js gzip	322 B	322 B	✓
bb14e60e810b..30f.css gzip	125 B	125 B	✓
Overall change	10.1 kB	10.1 kB	✓

Client Build Manifests

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
_buildManifest.js gzip	511 B	511 B	✓
Overall change	511 B	511 B	✓

Rendered Page Sizes

	vercel/next.js canary	timneutkens/next.js add/internal-webpack5-direct-usage-mode	Change
index.html gzip	538 B	538 B	✓
link.html gzip	550 B	550 B	✓
withRouter.html gzip	531 B	531 B	✓
Overall change	1.62 kB	1.62 kB	✓

Commit: dfffd23

ijjk · 2021-09-21T19:00:33Z

Failing test suites

Commit: dfffd23

test/integration/required-server-files/test/index.test.js

Required Server Files > should output required-server-files manifest correctly
Required Server Files > should set correct SWR headers with notFound gsp
Required Server Files > should set correct SWR headers with notFound gssp
Required Server Files > should render SSR page correctly
Required Server Files > should render dynamic SSR page correctly
Required Server Files > should render fallback page correctly
Required Server Files > should render SSR page correctly with x-matched-path
Required Server Files > should render dynamic SSR page correctly with x-matched-path
Required Server Files > should render fallback page correctly with x-matched-path and routes-matches
Required Server Files > should return data correctly with x-matched-path
Required Server Files > should render fallback optional catch-all route correctly with x-matched-path and routes-matches
Required Server Files > should return data correctly with x-matched-path for optional catch-all route
Required Server Files > should not apply trailingSlash redirect
Required Server Files > should normalize catch-all rewrite query values correctly
Required Server Files > should bubble error correctly for gip page
Required Server Files > should bubble error correctly for gssp page
Required Server Files > should bubble error correctly for gsp page
Required Server Files > should bubble error correctly for API page
Required Server Files > should normalize optional values correctly for SSP page
Required Server Files > should normalize optional values correctly for SSG page
Required Server Files > should normalize optional values correctly for SSG page with encoded slash
Required Server Files > should normalize optional values correctly for API page
Required Server Files > should match the index page correctly
Required Server Files > should match the root dyanmic page correctly

Expand output

● Required Server Files › should output required-server-files manifest correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should set correct SWR headers with notFound gsp

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should set correct SWR headers with notFound gssp

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render SSR page correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render dynamic SSR page correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render fallback page correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render SSR page correctly with x-matched-path

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render dynamic SSR page correctly with x-matched-path

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render fallback page correctly with x-matched-path and routes-matches

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should return data correctly with x-matched-path

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should render fallback optional catch-all route correctly with x-matched-path and routes-matches

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should return data correctly with x-matched-path for optional catch-all route

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should not apply trailingSlash redirect

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should normalize catch-all rewrite query values correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should bubble error correctly for gip page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should bubble error correctly for gssp page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should bubble error correctly for gsp page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should bubble error correctly for API page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should normalize optional values correctly for SSP page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should normalize optional values correctly for SSG page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should normalize optional values correctly for SSG page with encoded slash

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should normalize optional values correctly for API page

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should match the index page correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

● Required Server Files › should match the root dyanmic page correctly

Command failed with exit code 1 (EPERM): yarn install

  50 |     await fs.copy(appDir, workDir)
  51 |
> 52 |     await execa('yarn', ['install'], {
     |     ^
  53 |       cwd: workDir,
  54 |       stdio: ['ignore', 'inherit', 'inherit'],
  55 |       env: {

  at makeError (../node_modules/execa/lib/error.js:58:11)
  at handlePromise (../node_modules/execa/index.js:112:26)
  at integration/required-server-files/test/index.test.js:52:5

timneutkens added 3 commits September 21, 2021 13:03

Add NEXT_PRIVATE_LOCAL_WEBPACK5 to use local webpack version for core…

f649647

… debugging

upgrade local webpack version, use package reference to install webpa…

db2606c

…ck 4

Revert "upgrade local webpack version, use package reference to insta…

12c4788

…ll webpack 4" This reverts commit db2606c.

timneutkens requested review from huozhi, ijjk, padmaia, shuding and styfle as code owners September 21, 2021 11:22

ijjk added created-by: Next.js team PRs by the Next.js team. type: next labels Sep 21, 2021

This comment has been minimized.

Sign in to view

update compiled

30f326d

This comment has been minimized.

Sign in to view

lint-fix

ee7cb51

This comment has been minimized.

Sign in to view

compile again

e697eaf

This comment has been minimized.

Sign in to view

Merge branch 'canary' of github.com:vercel/next.js into add/internal-…

dfffd23

…webpack5-direct-usage-mode

timneutkens merged commit 60f1985 into vercel:canary Sep 22, 2021

timneutkens deleted the add/internal-webpack5-direct-usage-mode branch September 22, 2021 05:20

vercel locked as resolved and limited conversation to collaborators Jan 27, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add internal mode for debugging Next.js core webpack #29254

Add internal mode for debugging Next.js core webpack #29254

timneutkens commented Sep 21, 2021 •

edited

Loading

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

ijjk commented Sep 21, 2021

ijjk commented Sep 21, 2021

Add internal mode for debugging Next.js core webpack #29254

Add internal mode for debugging Next.js core webpack #29254

Conversation

timneutkens commented Sep 21, 2021 • edited Loading

Bug

Feature

Documentation / Examples

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

ijjk commented Sep 21, 2021

Stats from current PR

ijjk commented Sep 21, 2021

Failing test suites

timneutkens commented Sep 21, 2021 •

edited

Loading