Commit graph

6 commits

Author SHA1 Message Date
JJ Kasper
3667eba385
Pre-compile more dependencies continued (#32679) 2021-12-21 16:13:45 +01:00
Houssein Djirdeh
7a1c9eb17e
[ESLint] Introduce a new setup process when next lint is run for the first time (#26584)
This PR introduces an improved developer experience when `next lint` is run for the first time.

### Current behavior

`eslint-config-next` is a required package that must be installed before proceeding with `next lint` or `next build`:

![image](https://user-images.githubusercontent.com/12476932/123468791-43088100-d5c0-11eb-9ad0-5beb80b6c968.png)

Although this has helped many developers start using the new ESLint config, this has also resulted in a few issues:

- Users are required to install the full config (`eslint-config-next`) even if they do not use it or use the Next.js plugin directly (`eslint-plugin-next`).
  - #26348

- There's some confusion  on why `eslint-config-next` needs to be installed or how it should be used instead of `eslint-plugin-next`.
  - #26574
  - #26475
  - #26438

### New behavior

Instead of enforcing `eslint-config-next` as a required package, this PR prompts the user by asking what config they would like to start. This happens when `next lint` is run for the first time **and** if no ESLint configuration is detected in the application.

<img src="https://user-images.githubusercontent.com/12476932/124331177-e1668a80-db5c-11eb-8915-38d3dc20f5d4.gif" width="800" />

- The CLI will take care of installing `eslint` or `eslint-config-next` if either is not already installed
- Users now have the option to choose between a strict configuration (`next/core-web-vitals`) or just the base configuration (`next`)
- For users that decide to create their own ESLint configuration, or already have an existing one, **installing `eslint-config-next` will not be a requirement for `next lint` or `next build` to run**. A warning message will just show if the Next.js ESLint plugin is not detected in an ESLint config. 

  <img width="682" alt="Screen Shot 2021-06-25 at 3 02 12 PM" src="https://user-images.githubusercontent.com/12476932/123473329-6cc4a680-d5c6-11eb-9a57-d5c0b89a2732.png">

---

In addition, this PR also:

- Fixes #26348
- Updates documentation to make it more clear what approach to take for new and existing ESLint configurations
2021-08-04 21:53:15 +00:00
Houssein Djirdeh
f1fe4bbebf
[ESLint] Update default .eslintrc file created to have .json format (#26884) 2021-07-05 10:58:09 +02:00
Vitaly Baev
66cb786df0
fix: don't create .eslintrc if package.json contains eslintConfig (#26025)
* fix: don't create .eslintrc if package.json contains eslintConfig

* tests: added integration tests for next lint

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2021-06-14 15:57:18 -05:00
Houssein Djirdeh
bbc28ccae0
next lint + ESLint in Create Next App (#25064)
Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: Tim Neutkens <timneutkens@me.com>
2021-06-03 14:01:24 +02:00
Houssein Djirdeh
e783b0a2e8
Adds ESLint with default rule-set (#23702)
This PR re-includes ESLint with some notable changes, namely a guided setup similar to how TypeScript is instantiated in a Next.js application.

To add ESLint to a project, developers will have to create an `.eslintrc` file in the root of their project or add an empty `eslintConfig` object to their `package.json` file.

```js
touch .eslintrc
```

Then running `next build` will show instructions to install the required packages needed:

<img width="862" alt="Screen Shot 2021-04-19 at 7 38 27 PM" src="https://user-images.githubusercontent.com/12476932/115316182-dfd51b00-a146-11eb-830c-90bad20ed151.png">

Once installed and `next build` is run again, `.eslintrc` will be automatically configured to include the default config:

```json
{
  "extends": "next"
}
```

In addition to this change:

- The feature is now under the experimental flag and requires opt-in. After testing and feedback, it will be switched to the top-level namespace and turned on by default.
- A new ESLint shareable configuration package is included that can be extended in any application with `{ extends: 'next' }`
  - This default config extends recommended rule sets from [`eslint-plugin-react`](https://www.npmjs.com/package/eslint-plugin-react), [`eslint-plugin-react-hooks`](https://www.npmjs.com/package/eslint-plugin-react-hooks), and [`eslint-plugin-next`](https://www.npmjs.com/package/@next/eslint-plugin-next)
- All rules in [`eslint-plugin-next`](https://www.npmjs.com/package/@next/eslint-plugin-next) have been modified to include actionable links that show more information to help resolve each issue
2021-04-30 11:09:07 +00:00