Commit graph

204 commits

Author SHA1 Message Date
JJ Kasper
98106ba8d2
Re-enable sandbox cache and update AsyncLocalStorage usage (#42547)
Follow-up to https://github.com/vercel/next.js/pull/41402 this
re-enables the sandbox cache and updates to leverage our global
`AsyncLocalStorage` for isolating request meta in both the edge and
Node.js runtime.

Closes: https://github.com/vercel/next.js/issues/42349
Closes: https://github.com/vercel/next.js/issues/38235
Closes: https://github.com/vercel/next.js/issues/42225
Closes: https://github.com/vercel/next.js/issues/42351

## Bug

- [x] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
2022-11-06 14:56:48 -08:00
Tim Neutkens
e74de1a46c
Clarify app and pages file conflicting files (#42415)
Improvement to how the `app` and `pages` files conflict is shown.
Especially the last log line `"pages/" - "app/"` made it seem like you
should remove the `pages` folder altogether. This was a bug in how the
`''` case was displayed. After having a look at this I went further and
added exactly which file caused the conflict given that `app` allows you
to create `app/(home)/page.js` and such it saves some digging for what
the actual conflicting file is. Similarly in `pages` both
`pages/dashboard/index.js` and `pages/dashboard.js` are possible.

Before:
```
error - Conflicting app and page files were found, please remove the conflicting files to continue:
error -   "pages/another" - "app/another"
error -   "pages/hello" - "app/hello"
error -   "pages/" - "app/"
```

After:
```
error - Conflicting app and page files were found, please remove the conflicting files to continue:
error -   "pages/another.js" - "app/another/page.js"
error -   "pages/index.js" - "app/page.js"
error -   "pages/hello.js" - "app/hello/page.js"
```

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-11-03 12:50:39 -07:00
JJ Kasper
2a9e2f18e3
Update dev process exit handling (#42367)
Follow-up to https://github.com/vercel/next.js/pull/42255

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
2022-11-02 11:09:56 -07:00
JJ Kasper
86b3e7d5b1
Ensure we detect config correctly with turbo flag (#42201)
Ensures we handle the `configFileName` field properly from
`next.config.js`.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
2022-10-30 20:06:11 -07:00
Jiachi Liu
6028a7a69f
Remove react root condition and always use concurrent mode (#42141)
Removing the `hasReactRoot` condition and `__NEXT_REACT_ROOT` env var since next 13 requires latest react 18 to be installed, all the react 17 (non concurrent mode) compatible code can be dropped now.
2022-10-29 20:34:03 +00:00
Shu Ding
c8983a6b0a
Fix page static info extractor for app dir (#42001)
We currently only fallback to the global `runtime` option if the page
actually **needs** a runtime (not statically optimizable). That happens
for SSG (ISR) and SSR for pages/. But for app/, we will always need a
`runtime` to render server components.

Also in this PR, I improved the tests to actually **test** the runtime
to ensure it has `globalThis.EdgeRuntime` so it's not running in the
Node.js runtime
([ref](https://edge-runtime.vercel.app/features/available-apis#addressing-the-runtime)).

## Bug

- [ ] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-27 14:55:35 -07:00
Steven
b411567792
Print error when next dev has conflicting app & page (#41656)
This PR prints an error when the `app` and `pages` directory contain the
same route.

## build error
<img width="904" alt="image"
src="https://user-images.githubusercontent.com/229881/197424839-67dac580-1e1d-4c31-b769-112f2f38b06e.png">

## dev error
<img width="957" alt="image"
src="https://user-images.githubusercontent.com/229881/197426784-9b5041d9-b6d0-48d5-8ce5-b759bd9e4438.png">

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-23 20:09:59 -07:00
Hannes Bornö
a105515766
Create root layout (#41523)
Creates a root layout if it is missing in DEV when building the page in
`next-app-loader`. If the page is in a route group, the layout will be
created there. Otherwise it will create a layout directly under `/app`.

Breaks the build if a page is found that's missing a root layout.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
2022-10-23 00:39:30 -07:00
Jiachi Liu
b0f87fbc7c
Bundle ssr client layer excepts react externals (#41606)
Bundle the ssr client layer for RSC, this solves the problem when
there's an esm package is using on client components, but esm imports
the installed react instead of the built-in react version since esm
imports is not intercepted by require hook.

After bundling the ssr client layer and treating react as externals, now
react compiles as cjs externals and could be intercepted by require
hook, other code are bundled together which can also get optimized.

## 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`
- [x] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have a helpful link attached, see `contributing.md`

Co-authored-by: Shu Ding <g@shud.in>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-22 16:33:51 -07:00
JJ Kasper
4ce259fa3e
Update to handle correct react version with app (#41658)
Add auto install handling for the correct react experimental version for
app
2022-10-22 13:29:00 -07:00
Jiachi Liu
3a87e816fc
Disable using prebundled of react for appDir (#41635)
reverting https://github.com/vercel/next.js/pull/41337

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-21 23:55:19 -07:00
JJ Kasper
d76d8270d6
Update RSC detection in minimal mode and fix config collection (#41541)
Updates our RSC detection for revalidation in minimal mode and also ensures we await import promises when collecting app dir config. 

x-ref: [slack thread](https://vercel.slack.com/archives/C035J346QQL/p1666202250144319)
x-ref: [slack thread](https://vercel.slack.com/archives/C035J346QQL/p1666125853222599?thread_ts=1666122861.189349&cid=C035J346QQL)
2022-10-19 21:38:54 +00:00
Shu Ding
fda355daa2
Improve type checking (#41427)
This PR implements the process of generating strict "type guard" files,
to ensure that all entrypoints have the correct export types. The type
checking process happens automatically during `next build`.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

Co-authored-by: Tobias Koppers <tobias.koppers@googlemail.com>
2022-10-19 18:28:36 +02:00
Jiachi Liu
bc335d7ef7
Prebundle react for appDir (#41337)
Inline a react and react-dom for app dir, when `appDir` flag is enabled
opt into the built-in version for all.

For server layer react, use the react share subset for server
components.
For all server side of react-dom usage, use the server-rendering-stub.

Co-authored-by: Shu Ding <g@shud.in>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-18 16:32:23 -07:00
Steven
9c5bb5bfe9
BREAKING CHANGE: Remove target: serverless (#41495)
The `target: serverless` config was deprecated a year ago starting in
[Next.js 12](https://nextjs.org/blog/next-12).

Tests were disabled in #41252 so we can now remove `target: serverless`
and all usage of `target` in `next.config.js`.

Co-authored-by: Balázs Orbán <info@balazsorban.com>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-18 09:47:13 -07:00
Alexander Sviridov
f5cb7bd829
fix(41456): check src/app folder too in getHasAppDir (#41458)
fixes https://github.com/vercel/next.js/issues/41456

When we check if app folder exists, check for src/app path too

## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

Co-authored-by: Jiachi Liu <inbox@huozhi.im>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-17 15:32:44 -07:00
Jiachi Liu
f83cc0cbed
Enabel appDir when flag and dir existed at the same time (#41233)
If there's an existing folder named `app/` but `appDir` flag is not
enabled, do not enabled server components
2022-10-07 00:16:42 +02:00
Meno Abels
27fe5c8c28
Add response stream errorhandling in edge-function-runtime (#41102)
The behaviour of edge-function-runtime in the case of an error was not
identical to the edge-runtime.
If a type other than "Uint8Array" is written to the Response stream a
unhandledreject is raised and logged.
The current implementations(nodejs) accepts also Buffers and Strings
which causes that a Application
Developer things our stream implementation is broken if it is executed
as worker.
We introduced a helper function to consume the response stream and write
the "Uint8Array" stream chunks
to the server implementation. Due to the complication that the error
side effect is emitted via the unhandledrejection
handler it is almost impossible to test --- jest does not allow testing
of the unhandlerejections.
We tested extendsiveliy the helper in the edge-runtime so that this PR
integrates just the consuming function.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-10-06 11:56:13 -07:00
Jiachi Liu
5f2e44d451
Refactor app dir related flags (#41166)
simplify the `appDir` passing down
2022-10-04 22:16:44 +00:00
Jiachi Liu
34b78dc7c5
Handle hmr for edge ssr in app dir (#41156)
Include the edge server changes that starting in app dir into server components changes. Most changes are merging condition `isAppPath && this.appDir` into `isAppPath`.

## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`
2022-10-04 14:03:20 +00:00
Bartosz Kaszubowski
31c4641854
chore(server): improve dev logs formatting (#41109)
# Why

Use the custom, build-in logger for the dev server messages, to unify
their appearance with other ones:

<img width="415" alt="Screenshot 2022-10-02 135927"
src="https://user-images.githubusercontent.com/719641/193454207-88c415a2-9b43-45f3-ae52-3f088bccfd01.png">

# How

Replace `console` with `Log` calls in `next-dev-server.ts`.
2022-10-02 12:02:32 -07:00
Jiachi Liu
79a85b73ad
Alias all client, shared, pages dist assets for esm (#41034)
Alias all existing imports from `next/dist/..` to `next/dist/esm` for edge compiler. So that we don't need checking for `process.env.NEXT_RUNTIME === 'edge'` or passing down `nextRuntime` to decide wether the esm or cjs asset to require

This will also fix the issue that some layouts hook are been included twice into the bundle with cjs and esm bundle in edge runtime, now only esm chunk will be bundled in server.
2022-09-29 21:24:04 +00:00
Jimmy Lai
8ff22ca398
edge-ssr: bundle next/dist as ESM for better tree-shaking (#40251) (#40980)
Re-do of https://github.com/vercel/next.js/pull/40251

Edge SSR'd routes cold boot performances are proportional to the
executed code size.

In order to improve it, we are trying to optimize for the bundle size of
a packed Edge SSR route.

This PR adds ESM compilation targets for all Next.js dist packages and
use them to bundle Edge SSR'd route.

This allows us to leverage the better tree shaking/DCE for ESM modules
in webpack in order to decrease the overall bundle size.

This PR also enables minifying Edge SSR routes. Since we don't control
which minifier might be used later (if any), it's best if we provide an
already optimised bundle.

<img width="903" alt="image"

src="https://user-images.githubusercontent.com/11064311/190005211-b7cb2c58-a56a-44b0-8ee4-fd3f603e41bd.png">

This is a 10ms cold boot win per my benchmarking script, which I'll put
in a subsequent PR.

Not done yet:
- ~~swap exported requires in `next/link` (and others) etc to point them
to the esm modules version~~

<!--
Thanks for opening a PR! Your contribution is much appreciated. In order
to make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below. Choose the right checklist for
the change that you're making: -->

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

- [x] 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`

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Shu Ding <g@shud.in>

<!--
Thanks for opening a PR! Your contribution is much appreciated.
To make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below.
Choose the right checklist for the change that you're making:
-->

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Shu Ding <g@shud.in>
2022-09-28 12:29:22 +02:00
JJ Kasper
ccc8d271df
Revert "edge-ssr: bundle next/dist as ESM for better tree-shaking (#40251) (#40967)
This reverts commit 11deaaa82b.

Temporarily reverts the above commit due to breaking middleware/edge
functions once deployed.

Fixes:
https://github.com/vercel/next.js/actions/runs/3133433920/jobs/5087331787

cc @shuding @feedthejim 

```sh
[GET] /blog/first
13:56:56:61
2022-09-27T20:56:56.671Z	61d43a6a-34a1-40c0-b71f-4ae5d1918431	ERROR	/var/task/node_modules/next/dist/esm/client/router.js:1
/* global window */ import React from 'react';
                    ^^^^^^
SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1033:15)
    at Module._compile (node:internal/modules/cjs/loader:1069:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/var/task/node_modules/next/router.js:3:7)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
```
2022-09-27 15:05:40 -07:00
Ethan Arrowood
e0cc9cd44f
feat(experimental): option to polyfill fetch using undici in Node.js <18 (#40318)
This PR adds a new `experimental.enableUndici` option to let the
developer switch from `next-fetch` to `undici` as the underlying
polyfill for `fetch` in Node.js.

In the current implementation, Next.js makes sure that `fetch` is always
available by using `node-fetch`. However, we do not polyfill in Node.js
18+, since those versions come with their own `fetch` implementation
already, built-in.

Node.js 18+ uses `undici` under the hood, so letting the developer use
`undici` earlier could make the migration easier later on.

Eventually, we hope to be able to stop polyfilling `fetch` in an
upcoming major version of Next.js, shipping less code.


## 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 by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Co-authored-by: Balázs Orbán <info@balazsorban.com>
Co-authored-by: Sukka <isukkaw@gmail.com>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Steven <steven@ceriously.com>
2022-09-27 13:37:28 -07:00
Jimmy Lai
11deaaa82b
edge-ssr: bundle next/dist as ESM for better tree-shaking (#40251)
# Context

Edge SSR'd routes cold boot performances are proportional to the
executed code size.

In order to improve it, we are trying to optimize for the bundle size of
a packed Edge SSR route.

This PR adds ESM compilation targets for all Next.js dist packages and
use them to bundle Edge SSR'd route.

This allows us to leverage the better tree shaking/DCE for ESM modules
in webpack in order to decrease the overall bundle size.

This PR also enables minifying Edge SSR routes. Since we don't control
which minifier might be used later (if any), it's best if we provide an
already optimised bundle.

<img width="903" alt="image"
src="https://user-images.githubusercontent.com/11064311/190005211-b7cb2c58-a56a-44b0-8ee4-fd3f603e41bd.png">

This is a 10ms cold boot win per my benchmarking script, which I'll put
in a subsequent PR.

Not done yet:
- ~~swap exported requires in `next/link` (and others) etc to point them
to the esm modules version~~

<!--
Thanks for opening a PR! Your contribution is much appreciated.
In order to make sure your PR is handled as smoothly as possible we
request that you follow the checklist sections below.
Choose the right checklist for the change that you're making:
-->

## Bug

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

## Feature

- [x] 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 by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Co-authored-by: JJ Kasper <jj@jjsweb.site>
Co-authored-by: Shu Ding <g@shud.in>
2022-09-26 16:56:16 -07:00
Hannes Bornö
bf8ee1edb4
Add support for font loaders (#40746)
For some context:
[https://vercel.slack.com/archives/CGU8HUTUH/p1662124179102509](https://vercel.slack.com/archives/CGU8HUTUH/p1662124179102509)

Continuation of #40221 and #40227

Adds `experimental.fontLoaders`.

SWC next-font-loaders (#40221) transforms font loader (e.g. #40227) call
expressions into an import with the function call arguments as a query.

The imports will be matched by `next-font-loader`. It runs the
configured font loaders - emits font files and returns CSS. Exports are
added, and the font-family is made locally scoped. The returned CSS is
turned into a CSS module with `css-loader` which lets you consume the
font-family.

`FontLoaderManifestPlugin` creates a manifest of the preloaded font
files for each entrypoint. Preload/preconnect are then added in
`_document.tsx` if any font files were found for that path.

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-09-21 22:12:59 -07:00
Shu Ding
11dd1de655
Remove unnecessary experimental flag (#40766)
`config.experimental.serverComponents` is currently required to be
enabled or disabled together with `config.experimental.appDir` (which
means `serverComponents === appDir` otherwise it will throw) so there is
no reason to keep both of them. This PR removes `serverComponents` from
Next.js and only rely on `appDir` instead.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a 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 a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
2022-09-21 21:30:46 +02:00
JJ Kasper
aed2dc0c85
Add handling for static generation in app (#40561)
x-ref: [internal notes](https://www.notion.so/vercel/App-Static-Generation-dc5f1e0916684501b586e56a5b7b9483)
2022-09-19 18:05:28 +00:00
Jiachi Liu
295f9da393
Client directive (#40415)
## Feature
Change server components convention from using `.server.js` / `.client.js` file extension to determine it's a server or client component to using `'client'` js literal as a directive for determine client components boundary.
React RFC: https://github.com/reactjs/rfcs/pull/189
New behavior doesn't consume `.server.js` as server components any more, if you're enabling `serverComponents` flag, every `page.js` in app dir will become server components by default. If you adding a `'client'` directive to the page, then that page will become a client component. This rule also applies to the normal js components, client components will require a `'client'` directive to indicate its identity, instead of having a `.client.js` extension.
- [x] 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`
- [x] 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`

Co-authored-by: Shu Ding <3676859+shuding@users.noreply.github.com>
2022-09-18 00:00:16 +00:00
Damien Simonin Feugas
97ac344468
feat(edge): allows configuring Dynamic code execution guard (#39539)
### 📖  What's in there?

Dynamic code evaluation (`eval()`, `new Function()`, ...) is not
supported on the edge runtime, hence why we fail the build when
detecting such statement in the middleware or `experimental-edge` routes
at build time.

However, there could be false positives, which static analysis and
tree-shaking can not exclude:
- `qs` through these dependencies (get-intrinsic:
[source](https://github.com/ljharb/get-intrinsic/blob/main/index.js#L12))
- `function-bind`
([source](https://github.com/Raynos/function-bind/blob/master/implementation.js#L42))
- `has`
([source](https://github.com/tarruda/has/blob/master/src/index.js#L5))

This PR leverages the existing `config` export to let user allow some of
their files.
it’s meant for allowing users to import 3rd party modules who embed
dynamic code evaluation, but do not use it (because or code paths), and
can't be tree-shaked.

By default, it’s keeping the existing behavior: warn in dev, fails to
build.
If users allow dynamic code, and that code is reached at runtime, their
app stills breaks.

### 🧪 How to test?

- (existing) integration tests for disallowing dynamic code evaluation:
`pnpm testheadless --testPathPattern=runtime-dynamic`
- (new) integration tests for allowing dynamic code evaluation: `pnpm
testheadless --testPathPattern=runtime-configurable`
- (amended) production tests for validating the new configuration keys:
`pnpm testheadless --testPathPattern=config-validations`

To try it live, you could have an application such as:
```js
// lib/index.js
/* eslint-disable no-eval */
export function hasUnusedDynamic() {
  if ((() => false)()) {
    eval('100')
  }
}

export function hasDynamic() {
  eval('100')
}

// pages/index.jsx
export default function Page({ edgeRoute }) {
  return <p>{edgeRoute}</p>
}

export const getServerSideProps = async (req) => {
  const res = await fetch(`http://localhost:3000/api/route`)
  const data = await res.json()
  return { props: { edgeRoute: data.ok ? `Hi from the edge route` : '' } }
}

// pages/api/route.js
import { hasDynamic } from '../../lib'

export default async function handle() {
  hasDynamic()
  return Response.json({ ok: true })
}

export const config = { 
  runtime: 'experimental-edge' ,
  allowDynamic: '/lib/**'
}
```

Playing with `config.allowDynamic`, you should be able to:
- build the app even if it uses `eval()` (it will obviously fail at
runtime)
- build the app that _imports but does not use_ `eval()`
- run the app in dev, even if it uses `eval()` with no warning

### 🆙 Notes to reviewers

Before adding documentation and telemetry, I'd like to collect comments
on a couple of points:
- the overall design for this feature: is a list of globs useful and
easy enough?
- should the globs be relative to the application root (current
implementation) to to the edge route/middleware file?
- (especially to @sokra) is the implementation idiomatic enough? I've
leverage loaders to read the _entry point_ configuration once, then the
ModuleGraph to get it back during the parsing phase. I couldn't re-use
the existing `getExtractMetadata()` facility since it's happening late
after the parsing.
- there's a glitch with `import { ServerRuntime } from '../../types'` in
`get-page-static-info.ts`
([here](https://github.com/vercel/next.js/pull/39539/files#diff-cb7ac6392c3dd707c5edab159c3144ec114eafea92dad5d98f4eedfc612174d2L12)).
I had to use `next/types` because it was failing during lint. Any clue
why?

### ☑️ Checklist

- [ ] 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`
- [x] Integration tests added
- [x] Documentation added
- [x] Telemetry added. In case of a feature if it's used or not.
- [x] Errors have helpful link attached, see `contributing.md`
2022-09-12 15:01:00 -07:00
Jiachi Liu
c7d3f9d413
Drop legacy RSC handling in client for pages (#40472)
Remove the unused RSC handling for pages in both server router and client side in favor of using RSC in app dir
2022-09-12 13:15:18 +00:00
JJ Kasper
fc3ef810ba
Update dev watcher to ignore more accurately (#40412)
This ensures we ignore all except the files/directories we are explicitly wanting to watch to prevent watching/considering directories with massive amounts of files slowing down startup.

## Bug

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

Fixes: https://github.com/vercel/next.js/pull/38483#issuecomment-1242154665
2022-09-11 18:39:32 +00:00
Hannes Bornö
6fb1121e8c
Add missing trace for full reload event (#40393)
Added missing trace for `client-full-reload` event in hot reloader. Full
reload tests moved to hmr, think they make more sense there than on
their own.
2022-09-09 13:09:15 -07:00
Wyatt Johnson
c6ef857d57
Subresource Integrity for App Directory (#39729)
<!--
Thanks for opening a PR! Your contribution is much appreciated.
In order to make sure your PR is handled as smoothly as possible we
request that you follow the checklist sections below.
Choose the right checklist for the change that you're making:
-->

This serves to add support for [Subresource
Integrity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity)
hashes for scripts added from the new app directory. This also has
support for utilizing nonce values passed from request headers (expected
to be generated per request in middleware) in the bootstrapping scripts
via the `Content-Security-Policy` header as such:

```
Content-Security-Policy: script-src 'nonce-2726c7f26c'
```

Which results in the inline scripts having a new `nonce` attribute hash
added. These features combined support for setting an aggressive Content
Security Policy on scripts loaded.

## 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.
- [x] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [x] Make sure the linting passes by running `pnpm lint`
- [x] The examples guidelines are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Co-authored-by: Steven <steven@ceriously.com>
2022-09-08 15:17:15 -07:00
JJ Kasper
62c7eff354
Revert "Revert "Refactor Server Router" (#40328)" (#40333)
This unreverts https://github.com/vercel/next.js/pull/40328 as it wasn't
the cause for https://github.com/vercel/next.js/issues/40241 like
initially suspected and the actual fix has been included here as well
with regression test.

Fixes: https://github.com/vercel/next.js/issues/40241

## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`
2022-09-07 16:38:10 -07:00
Hannes Bornö
a9b9e00703
fix(switchable-runtime): Make it possible to switch between edge and server runtime in dev (#39327)
Makes it possible to switch between edge/server runtime in dev without
breaking the server.

Fixes slack:
[1](https://vercel.slack.com/archives/CGU8HUTUH/p1659082535540549)
[2](https://vercel.slack.com/archives/C02CDC2ALJH/p1658978287244359)
[3](https://vercel.slack.com/archives/C03KAR5DCKC/p1656869427468779)

#### middleware-plugin.ts
`middlewareManifest` moved from module scope to local scope. Stale state
from earlier builds ended up in `middleware-manifest.json`. Functions
that changed from edge to server runtime stayed in the manifest as edge
functions.

#### on-demand-entry-handler.ts
When a server or edge entry is added we check if it has switched
runtime. If that's the case the old entry is removed.

#### Reproduce
Create edge API route and visit `/api/hello`
```js
// pages/api/hello.js
export const config = {
  runtime: 'experimental-edge',
}

export default () => new Response('Hello')
```

Change it to a server api route and visit `/api/hello`, it will explode.
```js
// pages/api/hello.js
export default function (req, res) {
  res.send('Hello')
}
```

#### Bug not fixed
One EDGE case is not fixed. It occurs if you switch between edge and
server runtime several times without changing the content of the file:

Edge runtime
```js
export const config = {
  runtime: 'experimental-edge',
}

export default () => new Response('Hello')
```

Change it to a server runtime
```js
export default function (req, res) {
  res.send('Hello')
}
```

Change back to edge runtime, the content of the file is the same as the
first time we compiled the edge runtime version.
```js
export const config = {
  runtime: 'experimental-edge',
}

export default () => new Response('Hello')
```

The reason is that both the edge and server compiler emits to the same
file (/.next/server/pages/api/hello.js) which makes this check fail in
webpack:
https://github.com/webpack/webpack/blob/main/lib/Compiler.js#L849-L861
Possible solution is to use different output folders for edge and server
https://vercel.slack.com/archives/CGU8HUTUH/p1661163106667559

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-09-07 13:42:32 -07:00
JJ Kasper
d5e6eb1ef2
Revert "Refactor Server Router" (#40328)
This temporarily reverts the refactor while we investigate
https://github.com/vercel/next.js/issues/40241 further.

Reverts vercel/next.js#39902
2022-09-07 13:24:29 -07:00
Hannes Bornö
35253e1a93
fix(switchable-runtime): make dev server not break when wrong runtime config is exported (#40312)
Currently the DEV server can't recover if you export an invalid runtime
config. It ends up in a state where it stops to work but nothing is
printed to the terminal.

It now prints an error but keeps working. When building it should crash,
there's an existing test for that
https://github.com/vercel/next.js/blob/canary/test/production/exported-runtimes-value-validation/index.test.ts#L5-L17

#### Reproduce
```tsx
export default function Page() {
  return <p>hello world</p>
}

export const config = {
  runtime: 'something-odd',
}

```
2022-09-07 13:12:13 -07:00
Shu Ding
5f95b6b050
Improved route resolution in next-app-loader (#40109)
This PR implements the logic to make next-app-loader able to match multiple routes.

The app loader is refactored to construct the tree recursively instead of within a loop, as there could be multiple branches. Similarly, when entering a new layout level or branch, we resolve both the slot name (defaults to `"children"`) and the segment.

In order to make that work, the loader has to know all matched app paths. This is passed in as the `appPaths` loader option, which is gathered when creating the entrypoint.

## Bug

- [ ] Related issues linked using `fixes #number`
- [x] 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 by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-09-06 10:03:21 -07:00
Jiachi Liu
03eb4b1d61
Bypass empty pages folder for layouts (#40132)
Check `pagesDir` to bypass empty pages folder when appDir is enabled

* Output empty loadable manifest for now if there's no `pagesDir`
* No custom aliases with all page extensions for `/_app`, `_document` if pagesDir is empty, only keep the built-in ones
* Check pagesDir in build/dev-server/eslint
* Type safe: change arguments of some APIs from optional to required, so that we won't mess up with default arguments
2022-09-03 00:13:47 +00:00
Naoyuki Kanezawa
b522b94cce
feat(next): Support has match and locale option on middleware config (#39257)
## Feature

As the title, support `has` match, `local`  that works the same with the `rewrites` and `redirects` of next.config.js on middleware config. With this PR, you can write the config like the following:

```js
export const config = {
  matcher: [
    "/foo",
    { source: "/bar" },
    {
      source: "/baz",
      has: [
        {
          type: 'header',
          key: 'x-my-header',
          value: 'my-value',
        }
      ]
    },
    {
      source: "/en/asdf",
      locale: false,
     },
  ]
}
```

Also, fixes https://github.com/vercel/next.js/issues/39428

related https://github.com/vercel/edge-functions/issues/178, https://github.com/vercel/edge-functions/issues/179

- [x] 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`
- [x] 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`

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-31 11:23:30 -05:00
Wyatt Johnson
0b57a01ae6
Refactor Server Router (#39902)
<!--
Thanks for opening a PR! Your contribution is much appreciated.
In order to make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below.
Choose the right checklist for the change that you're making:
-->

This is intended to refactor the router code to reduce the overhead of executing routes. This is related to #32314 that may help reduce the memory overhead as this also replaced the `Set` with a `WeakMap`.

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-30 12:56:44 -05:00
Jiachi Liu
2407ab22b9
Treat non page file as non route under app dir (#39976)
## Bug

Adding a components folder inside a catch-all page triggers the error: "Catch-all must be the last part of the URL", having the component outside works, for example `app/[...slug]/components/*.tsx` fails but `app/components/*.tsx` works as expected.

### Fix

The reason it errors because they're treated as route and inserted into the url node tree where they shouldn't be treated in this way. Adding a helper to skip collecting and normailizing every file as route for app dir, but only do it for page files

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-08-26 20:21:53 +02:00
Shu Ding
f12788dee8
HMR for client CSS imports (#39916)
Follow-up to #39758, this PR makes sure that CSS imports (both global and CSS modules) from client components are not handled by mini-css-extract's HMR logic. Instead, we trigger a server component update and let the client to refetch the RSC payload.

However, we are still leveraging the mini-css-extract plugin to emit CSS assets. So in this PR we add a new pitch loader to calculate the original file hash, but replace the final content to eliminate HMR logic but only keep the hash (so hot reloader can keep tracking that).

## 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 by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)
2022-08-25 16:40:16 +00:00
JJ Kasper
49b4dae570
Handle edge runtime for app (#39910)
Continuation of https://github.com/vercel/next.js/pull/38817 this adds handling to allow leveraging the `experimental-edge` runtime for `app`. 

## Bug

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

Co-authored-by: Jiachi Liu <inbox@huozhi.im>
2022-08-24 14:49:47 -05:00
JJ Kasper
ec25b4742b
Add handling for auto installing TypeScript deps and HMRing tsconfig (#39838)
This adds handling for auto-detecting TypeScript being added to a project and installing the necessary dependencies instead of printing the command and requiring the user run the command. We have been testing the auto install handling for a while now with the `next lint` command and it has worked out pretty well. 

This also adds HMR handling for `jsconfig.json`/`tsconfig.json` in development so if the `baseURL` or `paths` configs are modified it doesn't require a dev server restart for the updates to be picked up. 

This also corrects our required dependencies detection as previously an incorrect `paths: []` value was being passed to `require.resolve` causing it to fail in specific situations.

Closes: https://github.com/vercel/next.js/issues/36201

### `next build` before

https://user-images.githubusercontent.com/22380829/186039578-75f8c128-a13d-4e07-b5da-13bf186ee011.mp4

### `next build` after


https://user-images.githubusercontent.com/22380829/186039662-57af22a4-da5c-4ede-94ea-96541a032cca.mp4

### `next dev` automatic setup and HMR handling

https://user-images.githubusercontent.com/22380829/186039678-d78469ef-d00b-4ee6-8163-a4706394a7b4.mp4


## Bug

- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [x] Errors have helpful link attached, see `contributing.md`
2022-08-23 13:16:47 -05:00
JJ Kasper
611e13f515
Fix disposing active entries in dev compilers (#39845)
As noticed in https://github.com/markdoc/markdoc/issues/131 it seems we are incorrectly disposing active entries causing HMR to fail after the configured `maxInactiveAge`. To fix this instead of only updating lastActiveTime for one compiler type's entry we update all active compiler types for the active entry. 

This also updates an existing test to catch this by waiting the `maxInactiveAge` before attempting a change that should trigger HMR. 

## Bug

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

Fixes: https://github.com/markdoc/markdoc/issues/131
2022-08-23 07:23:43 +00:00
JJ Kasper
d2a2cc7808
Skip building /500 in dev mode (#39828)
Follow-up to #39826 this skips ensuring the /500 page when in development as it's not used since we use the error overlay instead. This also fixes the case where we don't clear the stalled timeout debug log when an error is thrown during ensuring.
2022-08-22 11:59:23 -05:00
JJ Kasper
4955da9eed
Update stalled ensure log to use debug instead (#39826)
This updates the stalled ensure log to use debug instead the log isn't really actionable by the user and is more so meant for debugging purposes.
x-ref: slack thread
2022-08-22 11:32:30 -05:00