## 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)
There were a few issues with the scripts in the Electron examples:
* `dist` and `pack-app` would fail without a `name` and `version` in `package.json`.
* `type-check` didn't work because there isn't a `tsconfig.json` at the root. It needs to look in the `electron-src` and `renderer` folders respectively.
`electron-builder` also needed to be updated in order to run on macOS 12.3+ (see https://github.com/electron-userland/electron-builder/issues/6606).
## Documentation / Examples
- [x] Make sure the linting passes by running `yarn lint`
Co-authored-by: Lee Robinson <9113740+leerob@users.noreply.github.com>
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)
}
```
* 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
```
* docs: use descriptive links instead of "click here"
Linking text such as "here" or "click here" is not accessible (and
doesn't look that great either). The best example of why it's better to
use link text that provides context is that some screen readers allow
navigation by links alone. If all links say "click here", then how does
the user know which one to go to?
I tried to make the minimal change necessary to make the link text
descriptive but had to reword a few sentences that didn't read well.
* Apply suggestions from code review
Co-authored-by: Lee Robinson <me@leerob.io>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
This PR updates `example/with-electron`:
- Updates electron to version [12 (latest stable)](https://www.electronjs.org/releases/stable#12.0.2)
- Introduces the new `contextBridge` to increase security ([docs](https://www.electronjs.org/docs/api/context-bridge))
## Bug
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
## 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.
## Documentation / Examples
- [x] Make sure the linting passes
**What's the problem this PR addresses?**
A decent amount of the examples don't have a `name` field in `package.json` that matches their folder name, meaning they either lack a name or the names are duplicated.
I was testing Yarn 2 workspaces using the entire examples directory and needed to get rid of the duplicates.
**How did you fix it?**
Updated the names to match the names of their folders
* copy only compiled files into electron build for with-electron-typescript
* updated npm deps for with-electron-typescript
* copy only compiled files into electron build for with-electron
* updated npm deps for with-electron
Co-authored-by: JJ Kasper <jj@jjsweb.site>
Minor changes to examples. Updating major semver updates with only `package.json` changes.
I've done my best to make sure that these packages.json files all have `latest` for the `nextjs` package, `cross-env` for those with `server.js` files, etc.
I also added a `package.json` to `with-dynamic-app-layout` (it was missing one previously)
Made sure to test all of these packages post-upgrade to ensure maintained functionality
Electron recommends to disable nodeIntegration in BrowserViews.
This PR follows this recommendation and updates the example accordingly.
Changes:
- disable nodeIntegration
- update dependencies
* Examples: clarify language around Yarn create & npx
* add missing READMEs and create-next-app usage
* suggest people tag jthegedus in firebase related issues
* add yarn alt instructions
* cerebraljs example readme & fixes
* remove global npm install of create-next-app
* add npx to create-next-app command in examples
* add bash to shell snippets
* add yarn create to next-app command in examples
* fix READMEs named with lowercase
* change READMEs to use UPPERCASE
* Add Electron usage example
* Remove the deploy part
* Only allow GET request to our HTTP server
* Only allow request from an electron app (checking the user agent)
* Add warning about the local HTTP server
* Update package.json
* Update example to use Next.js v3
* Added required package.json fields with placeholders
* Use next:// file protocol to open internal built files
* Create next.config.js
* Update set-menu.js
* Update example to merge it with electron-next-skeleton ideas
