### What?
Consistently casing of pathname throughout the code-base. It is a simple
search and replace of all the ocuences 'athName' to 'athname'.
### Why?
I believe that the usage of the casing [pP]athName is likely a mistake,
as it is usually typed [pP]athname in the rest of the repo.
I think a case sensitive search replace from 'athName' to 'athname'
would be a small thing, and prevent this from growing.
### How?
I searched for pathname in the repo, and found a huge amount of hits.
Searching for 'athName' only returned a few.
The usePathname hook was the reason I came across this inconsistency. We
had the inconsistency in our own Next.js project, ie. `const pathName =
usePathname()`, and I noticed that when searching inside my project with
cases-sensitivity I found two hits of 'pathName' inside the
documentation for LoadableManifest.
This lead me to fork the repo and search, and then I found a few more
cases.
In each file I did a search for conflicts: if for example pathname was
already defined, it would be considered breaking if I changed a pathName
to pathname.
I could not find any cases where the variable was defined twice with the
same casing, so I believe this PR is safe.
I guess the test coverage/pipeline will tell us if this change is
breaking? If not I don't think I would be able to contribute that much
further in the time of writing.
Co-authored-by: JJ Kasper <[email protected]>
Updating the WordPress example, to a more modern example.
**Key features:**
- `robots.ts`: This automatically gets the robots.txt of the API route
and serves it on the `/robots.txt` route.
- `sitemap.ts`: This automatically gets all paths from the API and
generates a sitemap to serve on the `/sitemap.xml` route.
- `middleware.ts`: This contains a middleware function that checks the
users path for stored redirects, and redirects the user if a match is
found.
- `[[...slug]]`: This is the catch-all route that is used to render all
pages. It is important that this route is not removed, as it is used to
render all pages. It fetches the ContentType and renders the
corresponding
- `not-found.tsx`: This page is used for dynamic 404 handling - adjust
the database id to match your decired WordPress page, and make sure the
WordPress slug is "not-found", your 404 page will then be editable from
your CMS.
- `codegen.ts`: Automatic type generation for your WordPress
installation
- `Draft Mode`: Seamless Preview / Draft Preview support, using
authentication through WPGraphQL JWT Authentication and Next.js Draft
Mode
- `On Demand Cache Revalidation`: Including a bare minimum WordPress
theme that implements cache revalidation, WordPress link rewrites and
other utils for integrating with Next.js
✅ The "examples guidelines" are followed from our contributing doc
https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md✅ Make sure the linting passes by running pnpm build && pnpm lint. See
https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md
---------
Co-authored-by: Sam Ko <[email protected]>
Fixes#68533
A link to docs in `next-dev.d.ts` linked to the pages router docs in app
router templates. This was confusing, because some sections on this page
only work with pages router. This PR fixes that
---------
Co-authored-by: Sam Ko <[email protected]>
## 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
We already had `domains` as "not recommended" but this PR marks it as "deprecated" and prints a warning if its detected.
I also updated all examples to switch from `domains` to `remotePatterns`.
### 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.
### What?
Merged a bunch of dependabot alerts in my own canary branch, mainly
postcss patch updates, and one graphql minor update, to fix moderate
security vulnerabilities in examples. Spot checked most and look good
still. EDIT: also one in scripts/send-trace-to-jaeger
### Why?
Because safety
### How?
Dependabot
---------
Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: Steven <[email protected]>
<!--
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 <[email protected]>
Co-authored-by: Will Ezell <[email protected]>
Co-authored-by: Arcadio Quintero A <[email protected]>
Co-authored-by: Rafael <[email protected]>
Fixing the image URL in the meta property og:image
<!--
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:
-->
## 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/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:
-->
## 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)
## Documentation / Examples
Not sure that I need to provide type to all of components or not?
Let me know if you want me to provide.
- [x] Closes#38752
- [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)
Fixes#38749
Since we are calling it `API_URL`, it sounds more correct to require including the `/graphql` rather than making `WORDPRESS_API_URL` be just the root domain in https://github.com/vercel/next.js/blob/54f87245dc8a181759a3c8065a35c7fbb1d1d329/examples/cms-wordpress/README.md?plain=1#L96
## 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)
## Documentation / Examples
- [X] Make sure the linting passes by running `yarn lint`
Graphql API has updated with use of nodes, this bugfix updates these specifications.
Co-authored-by: JJ Kasper <[email protected]>
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)
}
```
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)
* 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 <[email protected]>
Add safety check for `CoverImage` in `/components/post-preview.js` so as to prevent error occurring in the absence of cover image for on posts listed for preview - fixes#23742.
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
```
* small tweaks for those testing on an existing site with missing author or featured image on posts
When migrating WordPress or using an exisitng site, sometimes you have published posts wth missing data. The graphql plugin will properly resolve these to null, but some of existing code accessing tries to access the node property on these null values. I've made these properties optional in the pages and also tweaked some of the components along similar lines.
* Lint fix
Co-authored-by: Luis Alvarez <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
