Skip to content

Migrate eslint configuration file from the eslintrc format #4227

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
William-nyarash wants to merge 1 commit into
base: source
Choose a base branch
from
Open

Migrate eslint configuration file from the eslintrc format #4227

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 9 additions & 1 deletion src/content/10/en/part10a.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ Now that we are somewhat familiar with the development environment let's enhance
npm install --save-dev eslint @babel/eslint-parser eslint-plugin-react eslint-plugin-react-native
```

Next, let's add a <i>.eslintrc.json</i> file in the <i>rate-repository-app</i> directory with the ESLint configuration into the following content:
Next, let's add a <i>eslint.config.mjs</i> file in the <i>rate-repository-app</i> directory with the ESLint configuration into the following content:

```javascript
{
Expand Down Expand Up @@ -171,6 +171,14 @@ And finally, let's add a <em>lint</em> script to the <i>package.json</i> file to
}
```

> [! NOTE]
> in the event that <em>npm run lint</em> produces this error message <em>ESLint couldn't find an eslint.config.(js|mjs|cjs) file. </em>

Run this migration
```shell
npx @eslint/migrate-config .eslintrc.json
```

Now we can check that the linting rules are obeyed in JavaScript files in the <i>src</i> directory and in the <i>App.js</i> file by running <em>npm run lint</em>. We will be adding our future code to the <i>src</i> directory but because we haven't added any files there yet, we need the <eM>no-error-on-unmatched-pattern</em> flag. Also if possible integrate ESLint with your editor. If you are using Visual Studio Code you can do that by, going to the extensions section and checking that the ESLint extension is installed and enabled:

![Visual Studio Code ESLint extensions](../../images/10/3.png)
Expand Down