diff --git a/docs/src/user-guide/getting-started.md b/docs/src/user-guide/getting-started.md index 655c170bd33..e13ff206581 100644 --- a/docs/src/user-guide/getting-started.md +++ b/docs/src/user-guide/getting-started.md @@ -8,15 +8,15 @@ eleventyNavigation: --- -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: +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. -* ESLint uses [Espree](https://github.com/eslint/espree) for JavaScript parsing. -* ESLint uses an AST to evaluate patterns in code. -* ESLint is completely pluggable, every single rule is a plugin and you can add more at runtime. +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. -## Installation and Usage +## Prerequisites -Prerequisites: [Node.js](https://nodejs.org/en/) (`^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.) +To use ESLint, you must have [Node.js](https://nodejs.org/en/) (`^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.) + +## Quick start You can install and configure ESLint using this command: @@ -28,14 +28,16 @@ If you want to use a specific shareable config that is hosted on npm, you can us ```shell # use `eslint-config-semistandard` shared config -# npm 6.x -npm init @eslint/config --config semistandard -# ⚠️ npm 7+, extra double-dash is needed: +# npm 7+ npm init @eslint/config -- --config semistandard # or (`eslint-config` prefix is optional) npm init @eslint/config -- --config eslint-config-semistandard + +# ⚠️ npm 6.x no extra double-dash: +npm init @eslint/config --config semistandard + ``` The `--config` flag also supports passing in arrays: @@ -58,8 +60,6 @@ npx eslint yourfile.js yarn run eslint yourfile.js ``` -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. - ## Configuration **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: 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. +## Global Install + +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. + +## Manual Set Up + +You can also manually set up ESLint in your project. + +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. + +1. Install the ESLint package in your project: + + ```shell + npm install --save-dev eslint + ``` + +1. Add an `.eslintrc` file in one of the [supported configuration file formats](./configuring/configuration-files#configuration-file-formats). + + ```shell + # Create JavaScript configuration file + touch .eslintrc.js + ``` + +1. Add configuration to the `.eslintrc` file. Refer to the [Configuring ESLint documentation](configuring/) to learn how to add rules, environments, custom configurations, plugins, and more. + + ```js + // .eslintrc.js example + module.exports = { + "env": { + "browser": true, + "es2021": true + }, + "extends": "eslint:recommended", + "parserOptions": { + "ecmaVersion": "latest", + "sourceType": "module" + }, + } + ``` + +1. Lint code using the ESLint CLI: + + ```shell + npx eslint project-dir/ file1.js + ``` + + For more information on the available CLI options, refer to [Command Line Interface](./command-line-interface). + --- ## Next Steps