we can import server or client components in any server component, not from it.
## 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 `yarn lint`
Co-authored-by: Tim Neutkens <6324199+timneutkens@users.noreply.github.com>
Co-authored-by: JJ Kasper <22380829+ijjk@users.noreply.github.com>
<!--
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:
--
## Documentation / Examples
- [ ] Make sure the linting passes by running `yarn lint`
** I've made the change via GitHub UI sorry :)**
Hi,
I think the "data must be public" condition on getSSP is not really true, and even counter-productive. Being able to statically render more content is most probably positive, in terms of perceived and real performance of the app + energy consumption. It's actually totally possible, and not even that hard thanks to middleware, to statically render custom, paid, segment-specific content (and even individual-specific content under certain conditions).
I've documented the reason for this change in a few places if you want more details:
- related PR on React: https://github.com/reactjs/reactjs.org/pull/4566
- demo implementation and explanation on how to couple middlewares and getSSP to statically render any kind of content (including custom content): https://blog.vulcanjs.org/render-anything-statically-with-next-js-and-the-megaparam-4039e66ffde
This PR fixes a request from `@rauchg` that we specify more clearly that Middleware is Beta and organize it properly within the navigation.
## 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
- [x] Make sure the linting passes by running `yarn lint`
* Added next.config.mjs for @next/mdx
* Replaced leftover reference to babel
* Fixed formatting problem
* Added next-mdx-remote and @mdx-js/mdx as options
This adds documentation for the `x-nextjs-cache` header which is now exposed for ISR pages and image optimization requests to help signal the cache state.
## Documentation / Examples
- [x] Make sure the linting passes by running `yarn lint`
Co-authored-by: Steven <steven@ceriously.com>
As per the feedback in #35952.
## 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 `yarn lint`
Migrating from express to nextjs API routes broke one of our APIs because of how `redirect` works in nextjs vs. how it works in express. We need to redirect the user to a confirmation page via GET after making a POST request, which is not possible with `redirect`.
HTTP 303 seems to be the way to go in that case and I think it should be mentioned here.
## Documentation / Examples
- [ ] Make sure the linting passes by running `yarn lint`
Removed the misleading TTFB information. It was easy to read that incorrectly and while getStaticProps does have a better TTFB that's not why you might need to avoid getServerSideProps, I gave better examples.
I also wanted to answer "well how do I cache `getServerSideProps`?" and now there's a link.
## Documentation / Examples
- [x] Make sure the linting passes by running `yarn lint`
This PR add necessary information to the Manual Section to add directories such as `pages` and `public`.
## Bug
- [x] Related issues linked using fixes#29479
- [ ] 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 `yarn lint`
## 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
- [x] Make sure the linting passes by running `yarn lint`
This PR updates the docs and examples for `create-next-app` to include pnpm usage.
The following script was used to update every example README:
```js
const fs = require('fs')
const examples = fs.readdirSync('./examples')
for (let example of examples) {
const filename = `./examples/${example}/README.md`
const markdown = fs.readFileSync(filename, 'utf8')
const regex = new RegExp(`^yarn create next-app --example (.*)$`, 'gm')
const output = markdown.replace(regex, (yarn, group) => {
const pnpm = `pnpm create next-app -- --example ${group}`
return `${yarn}\n# or\n${pnpm}`
})
fs.writeFileSync(filename, output)
}
```
Added missing closing double quote : `strategy="worker` -> `strategy="worker"`
## 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 `yarn lint`
Logging and analytics are not provided in vercel/examples using middleware.
## 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 `yarn lint`
Correct the type of `trailingSlash` in config example
Modified: `docs/api-reference/next.config.js/rewrites.md`
```diff
- trailingSlash: 'true',
+ trailingSlash: true,
```
* Update rsc refresh typing and doc example
* Update docs/api-reference/next/streaming.md
Co-authored-by: Shu Ding <g@shud.in>
Co-authored-by: Shu Ding <g@shud.in>
The following files have been modified.
- `docs/api-reference/next.config.js/rewrites.md`
- `docs/basic-features/script.md`
## Documentation / Examples
- [x] Make sure the linting passes by running `yarn lint`
The docs for the react server components preview refer refer to `next@latest` which doesn't work. The linked demo uses `canary` so I replaced it in the install command.
Leave more clear that <Script> component can't be used inside Head. Current it says "without need", which don't implies it can't be used.
## 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
- [x] Make sure the linting passes by running `yarn lint`
While reading the documentation, I noticed that this paragraph was not correctly written and was hard to read. I fixed it adding a dot.
## Documentation / Examples
- [ ] Make sure the linting passes by running `yarn lint`
This PR looks to clear up some confusion users are having around our decision to use 307 and 308 redirects, instead of 301 and 302
## 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
- [x] 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 `yarn lint`
Co-authored-by: JJ Kasper <22380829+ijjk@users.noreply.github.com>
* Update docs about Cache-Control default headers.
* Update docs: Override the default in case of gSSP
* Apply suggestions from code review
* Update going-to-production.md
Co-authored-by: Balázs Orbán <info@balazsorban.com>
This PR adds a new layout mode for images called `raw`, as discussed with the core team a while back. This mode has the following characteristics:
- No wrapper `span` around the `img` element
- No sizer svg
- Almost no styles automatically added to the `img` element
- `style` parameter is allowed and is passed through to the underlying `img` element
This also adds documentation changes to describe the new component.
There are a few tradeoffs and DX decisions that may warrant discussion/revision before merging. I'll add a few comments to highlight those issues.
- Related to #18637
## Summary
This PR adds a new `worker` strategy to the `<Script />` component that automatically relocates and executes the script in a web worker.
```jsx
<Script
strategy="worker"
...
/>
```
[Partytown](https://partytown.builder.io/) is used under the hood to provide this functionality.
## Behavior
- This will land as an experimental feature and will only work behind an opt-in flag in `next.config.js`:
```js
experimental: {
nextScriptWorkers: true
}
```
- This setup use a similar approach to how ESLint and Typescript is used in Next.js by showing an error to the user to install the dependency locally themselves if they've enabled the experimental `nextScriptWorkers` flag.
<img width="1068" alt="Screen Shot 2022-03-03 at 2 33 13 PM" src="https://user-images.githubusercontent.com/12476932/156639227-42af5353-a2a6-4126-936e-269112809651.png">
- For Partytown to work, a number of static files must be served directly from the site (see [docs](https://partytown.builder.io/copy-library-files)). In this PR, these files are automatically copied to a `~partytown` directory in `.next/static` during `next build` and `next dev` if the `nextScriptWorkers` flag is set to true.
## Checklist
- [X] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [X] Related issues linked using `fixes #number`
- [X] Integration tests added
- [X] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
This PR fixes#31517.
Minor change to improve caveat clarity of doing shallow routing
## Documentation / Examples
- [x] Make sure the linting passes by running `yarn lint`
Co-authored-by: Lee Robinson <9113740+leerob@users.noreply.github.com>
* feat: support `pnpm` with `create-next-app`
* test: add `--use-pnpm` tests
* docs: mention `--use-pnpm` flag in docs
* test: remove `only`
* Update test/integration/create-next-app/index.test.ts
Co-authored-by: Steven <steven@ceriously.com>
* chore: add pnpm action setup to tests
* chore: use latest pnpm
* chore: debug
* chore: debug
* fix: fall back to `yarn` instead of `npm`
* test: run all tests
Co-authored-by: Steven <steven@ceriously.com>
- Moves example out of hidden dropdown at the top and features more prominently
- Adds a clone and deploy link for those looking to get started immediately
- Cross-posts ignoring TS errors docs over, because I've personally assumed it should be on this page and then ctrl+f found nothing
- Added version history to the top, based on contents of this file
- Remove custom app caveats from code snippet to improve copy-paste ability
Howdy!
MDX no longer has an `inlineCode` component in their MDXProvider ([source](https://mdxjs.com/table-of-components/)). They've migrated to a `pre` component for blocks of code and a `code` component for inline code snippets, so I've updated the example to reflect this.
I validated this locally with these example components:
```jsx
const Code = (props) => (
<code>
{props.children}
</code>
);
const Pre = (props) => (
<pre>
{props.children}
</pre>
);
const components = {
pre: Pre,
code: Code,
...
};
```
Applied to a test `mdx` file:
```md
This is an `inline` example.
~~~
<p>Test code</p>
~~~
```
Which generates the following html:
```html
<p>This is an <code>inline</code> example.</p>
<pre>
<code><p>Test code</p></code>
</pre>
```
## Documentation / Examples
- [ ] Make sure the linting passes by running `yarn lint`
* Add Error Handling document
* Update error-handling.md
* Add more services on client errors after Jeff's recommendation
* Update docs/advanced-features/error-handling.md
Co-authored-by: Steven <steven@ceriously.com>
* Update docs/advanced-features/error-handling.md
Co-authored-by: Steven <steven@ceriously.com>
* Update error-handling.md
* Add info about handling file not found error
* Add a screenshot of overlay when in development mode
Co-authored-by: Steven <steven@ceriously.com>
