Fix custom app file regex

[jacksonhardaker]

Given a directory path containing special characters i.e. /Users/jackson/a+b/my-app
next build will fail with the following error:

Failed to compile.

./styles/globals.css
Global CSS cannot be imported from files other than your Custom <App>. Due to the Global nature of stylesheets, and to avoid conflicts, Please move all first-party global CSS imports to pages/_app.js. Or convert the import to Component-Level CSS (CSS Modules).
Read more: https://nextjs.org/docs/messages/css-global
Location: pages/_app.js

This looks to be due to the path being directly covered to regexp without taking into account the possibility of special characters:

next.js/packages/next/build/webpack-config.ts

Lines 1564 to 1566 in 2f26fb4

	customAppFile: new RegExp(
	path.join(pagesDir, `_app`).replace(/\\/g, '(/|\\\\)')
	),

To reproduce:

mkdir a+b && cd $_
yarn create next-app
cd my-app && yarn build

I've dropped a simple integration test in to prevent regressions, but there may be a better place/location for this to be tested.

Bug

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

[ijjk]

Thanks for the PR, change and added test look good!

[ijjk]

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
buildDuration	16.2s	16.2s	⚠️ +63ms
buildDurationCached	4.1s	4s	-61ms
nodeModulesSize	182 MB	182 MB	⚠️ +145 B

Page Load Tests Overall increase ✓

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
/ failed reqs	0	0	✓
/ total time (seconds)	3.635	3.674	⚠️ +0.04
/ avg req/sec	687.78	680.5	⚠️ -7.28
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.972	1.932	-0.04
/error-in-render avg req/sec	1267.61	1293.87	+26.26

Client Bundles (main, webpack, commons)

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
779.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42.2 kB	42.2 kB	✓
main-HASH.js gzip	27 kB	27 kB	✓
webpack-HASH.js gzip	1.45 kB	1.45 kB	✓
Overall change	70.8 kB	70.8 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	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.15 kB	4.15 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	jacksonhardaker/next.js fix-custom-app-file-regex	Change
_buildManifest.js gzip	494 B	494 B	✓
Overall change	494 B	494 B	✓

Rendered Page Sizes

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	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	jacksonhardaker/next.js fix-custom-app-file-regex	Change
buildDuration	8.4s	8s	-423ms
buildDurationCached	3.8s	3.8s	-9ms
nodeModulesSize	182 MB	182 MB	⚠️ +145 B

Page Load Tests Overall increase ✓

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
/ failed reqs	0	0	✓
/ total time (seconds)	3.806	3.841	⚠️ +0.04
/ avg req/sec	656.84	650.87	⚠️ -5.97
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	2.008	1.985	-0.02
/error-in-render avg req/sec	1245.23	1259.75	+14.52

Client Bundles (main, webpack, commons)

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	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	35 kB	35 kB	✓
webpack-HASH.js gzip	1.64 kB	1.64 kB	✓
Overall change	101 kB	101 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	Change
_app-HASH.js gzip	1.33 kB	1.33 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.79 kB	2.79 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	jacksonhardaker/next.js fix-custom-app-file-regex	Change
_buildManifest.js gzip	511 B	511 B	✓
Overall change	511 B	511 B	✓

Rendered Page Sizes

	vercel/next.js canary	jacksonhardaker/next.js fix-custom-app-file-regex	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	✓

Commit: d736d4b