We've been testing React v19 and we're mostly ready. Since we have a
number of upstream packages we have to update peer deps from:
```json
{
"peerDependencies": {
"react": "^18.3",
"react-dom": "^18.3"
}
}
```
to:
```json
{
"peerDependencies": {
"react": "^18.3 || ^19",
"react-dom": "^18.3 || ^19"
}
}
```
We are choosing to change the `next` semver from `latest` to `^14.2.3`.
This is to avoid the template from breaking after v15 becomes `latest`,
since package manager default behaviour doesn't handle conflicting peer
dep ranges for react very well 🙌
- Uses the new `presentationTool.resolve.locations` instead of
`presentationTool.locate` API, which doesn't require wrangling `rxjs`.
- Sets up the new `presentationTool.resolve.mainDocuments` API, which
automatically opens up the post you're previewing on the left side in
the editor on the right side.
- Removes the `sanity-typegen.json` config file as `sanity typegen` now
looks for top level `app` and `sanity` folders by default.
- Enables `^` semver ranges for deps again now that our turbopack
support is stable, so that we only have to send you PRs when bumping
majors or changing the implementation itself.
- Sets up `sanity.config.ts` so it's possible to use `npx sanity dev`
for quickly iterating on schemas.
As `@sanity/preview-url-secret` wasn't declared as a dependency when
doing:
```bash
pnpm install && pnpm build
```
It would fail to compile:
```bash
Linting and checking validity of types .Failed to compile.
./app/api/draft/route.tsx:6:36
Type error: Cannot find module '@sanity/preview-url-secret' or its corresponding type declarations.
4 | */
5 |
> 6 | import { validatePreviewUrl } from "@sanity/preview-url-secret";
| ^
7 | import { draftMode } from "next/headers";
8 | import { redirect } from "next/navigation";
9 |
```
This PR updates the `cms-sanity` example to use:
- App Router
- TypeScript
- Sanity Studio v3 instead of v2
- Embeds the Studio inside the next app on the `/studio` route.
- ISR / Data Cache (revalidations through `revalidatePath` while in Live
Visual Editing, time-based to match the Sanity API CDN in production).
- Support Vercel Visual Editing out of the box.
- The new `next-sanity/image` component.
- Vercel Speed Insights.
- The Sanity Presentation Tool for live content previews.
- Sanity Portable Text setup to fully support `@tailwindcss/typography`.
- [AI Assist](https://www.sanity.io/docs/ai-assist)
- Auto fill in `alt` text on images.
- Preset prompts for content creation
### What?
I fixed two of the Markdown subheadline links in the Sanity example
readme.
### Why?
The weren't working.
Co-authored-by: Sam Ko <sam@vercel.com>
## Description
This PR ensures that the default prettier config is used for examples
and templates.
This config is compatible with `prettier@3` as well (upgrading prettier
is bigger change that can be a future PR).
## Changes
- Updated `.prettierrc.json` in root with `"trailingComma": "es5"` (will
be needed upgrading to prettier@3)
- Added `examples/.prettierrc.json` with default config (this will
change every example)
- Added `packages/create-next-app/templates/.prettierrc.json` with
default config (this will change every template)
## Related
- Fixes#54402
- Closes#54409
### Reason for making this change
https://yarnpkg.com/getting-started/qa#:~:text=yarn%2Finstall%2Dstate.,your%20workspaces%20all%20over%20again.
In the official documentation of `yarn`, it is stated that `.yarn/install-state.gz` is an optimization file that developer shouldn't ever have to commit. However, currently, when running `create-next-app`, `.yarn/install-state.gz` is being commited.
### Remaining work
I apologize for only modifying one template initially to initiate the discussion first.
If this change is agreed upon, it should be synchronized with other `.gitignore` templates. Would it be possible to follow a similar approach as in https://github.com/vercel/next.js/pull/47241? I would appreciate any assistance in syncing this change.
This PR updates the minimum version of React used by examples from 17.0.2 to 18.2.0.
Fixes#41975
## Bug
- [x] Related issues linked using `fixes #41975`
- [ ] 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
- [x] Make sure the linting passes by running `pnpm build && pnpm lint`
- [x] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
<!--
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 adds a new example under cms-dotcms/. Is a general-purpose example
that should allow developers to undestand how to use next.js with dotCMS
apis.
## 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
- [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: Daniel Esteves <estevesd8@gmail.com>
Co-authored-by: Will Ezell <will@dotcms.com>
Co-authored-by: Arcadio Quintero A <oidacra@gmail.com>
Co-authored-by: Rafael <rjvelazco21@gmail.com>
We use the variable "SANITY_REVALIDATE_SECRET" on the index page, but
the .env.local.example does not have this variable.
<!--
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)
This PR updates a few features from experimental to stable status:
- `next/future/image` component
- `remotePatterns` configuration
- `unoptimized` configuration
<!--
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:
-->
## Summary
- Added jsdoc typing for all examples using `next.config.js`
- Added jsdoc typing for all examples using `tailwind.config.js`
## 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)
## Changes
- Migrate class based `_document`s to functional documents
- Removed `_document.js` where default
- Removed `MyDocument.getInitialProps` where default
## Motivation
This removes some boilerplate and prepares examples for server components.
## 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)
## Feature
- [x] Documentation added
## Documentation / Examples
- [x] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)
This PR updates the cms-sanity example to:
- Deploy to Vercel with the [Sanity Vercel Integration](https://www.sanity.io/docs/vercel-integration) by default.
- You can still opt-out of using the Sanity Vercel Integration, clicking `You can also set up manually` gives you all the information you need.
- The blog itself is updated so it's much more resilient to missing data, and is setup to set `revalidate: 60` until you have a On-demand Revalidation webhook setup.
- Preview Mode is now enabled on the frontpage as well.
- The Sanity client setup, and webhook validation, are updated to follow our current best practices.
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)
}
```
Upgrades `next-sanity` to the latest version and applies breaking changes.
Improves the docs for the Sanity example.
## Documentation / Examples
- [x] Make sure the linting passes by running `yarn lint`
Co-authored-by: even westvang <172952+evenwestvang@users.noreply.github.com>
Updates all CMS updates to use:
- Tailwind 3 (and the corresponding `tailwind.config.js` and PostCSS changes)
- `remark@14` and `remark-html@15` (and the corresponding ESM breaking changes)
- `date-fns` minor bump
Ensured all CMS examples were:
- Using `next/image`
- Not using `as` for `next/link` (no longer needed)
The client now warns against missing `apiVersion` ([docs](https://www.sanity.io/docs/api-versioning)). This PR adds the config for using the latest API version. There shouldn't be breaking changes in this app.
## 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
* Add licences to all example/package.json that lack them
* Revert "Add licences to all example/package.json that lack them"
This reverts commit 5d4e25012f7334772b8ef5924bc355277e827cba.
* Update check-examples to remove `license` field from examples
* Remove `license` from all examples.
This was mentioned in vercel/next.js#27121 but it looks like it didn't end up being in the merge?
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Clean up package.json files in the `examples` directory:
- Add `private: true`
- Remove `version` (because they are irrelevant for packages that are not meant to be published)
- Remove `name` (because they are optional for packages that are not meant to be published, and when someone clones an example, they often rename it and the property becomes stale)
- Remove `author`
- Remove `description`
- Remove `license`
Also remove `with-dynamic-app-layout` example completely, since it does the same as `layout-component` (https://github.com/vercel/next.js/pull/27121#discussion_r668178408).
## Documentation / Examples
- [x] Make sure the linting passes
[With next 11 requiring react 17](https://nextjs.org/blog/next-11#upgrade-guide), most of the examples
need to be updated, so the following snippet updated all the examples to
a compatible react version.
```bash
cd examples/
fd -g 'package.json' | xargs sed -r -i 's/"react": ".*"/"react": "^17.0.2"/
fd -g 'package.json' | xargs sed -r -i 's/"react-dom": ".*"/"react-dom": "^17.0.2"/'
# exclude experimental react version
git checkout with-reason-relay/package.json
```
