docs: User Guide Getting Started expansion (#16596) · eslint/eslint@b68440f (original) (raw)

`@@ -8,15 +8,15 @@ eleventyNavigation:

`

8

8

``

9

9

`---

`

10

10

``

11

``

`-

ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs. In many ways, it is similar to JSLint and JSHint with a few exceptions:

`

``

11

`+

ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs.

`

12

12

``

13

``

`-

`

14

``

`-

`

15

``

`-

`

``

13

`+

ESLint is completely pluggable. Every single rule is a plugin and you can add more at runtime. You can also add community plugins, configurations, and parsers to extend the functionality of ESLint.

`

16

14

``

17

``

`-

Installation and Usage

`

``

15

`+

Prerequisites

`

18

16

``

19

``

`` -

Prerequisites: Node.js (^12.22.0, ^14.17.0, or >=16.0.0) built with SSL support. (If you are using an official Node.js distribution, SSL is always built in.)

``

``

17

`` +

To use ESLint, you must have Node.js (^12.22.0, ^14.17.0, or >=16.0.0) installed and built with SSL support. (If you are using an official Node.js distribution, SSL is always built in.)

``

``

18

+

``

19

`+

Quick start

`

20

20

``

21

21

`You can install and configure ESLint using this command:

`

22

22

``

`@@ -28,14 +28,16 @@ If you want to use a specific shareable config that is hosted on npm, you can us

`

28

28

``

29

29

```` ```shell


`30`

`30`

`` # use `eslint-config-semistandard` shared config

``

`31`

``

`-

# npm 6.x

`

`32`

``

`-

npm init @eslint/config --config semistandard

`

`33`

`31`

``

`34`

``

`-

# ⚠️ npm 7+, extra double-dash is needed:

`

``

`32`

`+

# npm 7+

`

`35`

`33`

`npm init @eslint/config -- --config semistandard

`

`36`

`34`

``

`37`

`35`

`` # or (`eslint-config` prefix is optional)

``

`38`

`36`

`npm init @eslint/config -- --config eslint-config-semistandard

`

``

`37`

`+`

``

`38`

`+

# ⚠️ npm 6.x no extra double-dash:

`

``

`39`

`+

npm init @eslint/config --config semistandard

`

``

`40`

`+`

`39`

`41`

```` ```

40

42

``

41

43

`` The --config flag also supports passing in arrays:

``

`@@ -58,8 +60,6 @@ npx eslint yourfile.js

`

58

60

`yarn run eslint yourfile.js

`

59

61

```` ```


`60`

`62`

``

`61`

``

`` -

It is also possible to install ESLint globally rather than locally (using `npm install eslint --global`). However, this is not recommended, and any plugins or shareable configs that you use must be installed locally in either case.

``

`62`

``

`-`

`63`

`63`

`## Configuration

`

`64`

`64`

``

`65`

`65`

`**Note:** If you are coming from a version before 1.0.0 please see the [migration guide](migrating-to-1.0.0).

`

`` @@ -93,6 +93,54 @@ Your `.eslintrc.{js,yml,json}` configuration file will also include the line:

``

`93`

`93`

``

`94`

`94`

`Because of this line, all of the rules marked "(recommended)" on the [rules page](../rules) will be turned on. Alternatively, you can use configurations that others have created by searching for "eslint-config" on [npmjs.com](https://www.npmjs.com/search?q=eslint-config). ESLint will not lint your code unless you extend from a shared configuration or explicitly turn rules on in your configuration.

`

`95`

`95`

``

``

`96`

`+

## Global Install

`

``

`97`

`+`

``

`98`

`` +

It is also possible to install ESLint globally, rather than locally, using `npm install eslint --global`. However, this is not recommended, and any plugins or shareable configs that you use must still be installed locally if you install ESLint globally.

``

``

`99`

`+`

``

`100`

`+

## Manual Set Up

`

``

`101`

`+`

``

`102`

`+

You can also manually set up ESLint in your project.

`

``

`103`

`+`

``

`104`

`` +

Before you begin, you must already have a `package.json` file. If you don't, make sure to run `npm init` or `yarn init` to create the file beforehand.

``

``

`105`

`+`

``

`106`

`+

1. Install the ESLint package in your project:

`

``

`107`

`+`

``

`108`

```` +

```shell

``

109

`+

npm install --save-dev eslint

`

``

110


```

``

111

+

``

112

`` +

  1. Add an .eslintrc file in one of the supported configuration file formats.

``

``

113

+

``

114


```shell

``

115

`+

Create JavaScript configuration file

`

``

116

`+

touch .eslintrc.js

`

``

117


```

``

118

+

``

119

`` +

  1. Add configuration to the .eslintrc file. Refer to the Configuring ESLint documentation to learn how to add rules, environments, custom configurations, plugins, and more.

``

``

120

+

``

121


```js

``

122

`+

// .eslintrc.js example

`

``

123

`+

module.exports = {

`

``

124

`+

"env": {

`

``

125

`+

"browser": true,

`

``

126

`+

"es2021": true

`

``

127

`+

},

`

``

128

`+

"extends": "eslint:recommended",

`

``

129

`+

"parserOptions": {

`

``

130

`+

"ecmaVersion": "latest",

`

``

131

`+

"sourceType": "module"

`

``

132

`+

},

`

``

133

`+

}

`

``

134


```

``

135

+

``

136

`+

  1. Lint code using the ESLint CLI:

`

``

137

+

``

138


```shell

``

139

`+

npx eslint project-dir/ file1.js

`

``

140


```

``

141

+

``

142

`+

For more information on the available CLI options, refer to Command Line Interface.

`

``

143

+

96

144

`---

`

97

145

``

98

146

`## Next Steps

`