Skip to content

Latest commit

 

History

History
56 lines (37 loc) · 3.23 KB

linting-javascript.md

File metadata and controls

56 lines (37 loc) · 3.23 KB
title description ms.date ms.topic ms.devlang author ms.author manager ms.technology dev_langs ms.workload monikerRange
Linting JavaScript in Visual Studio
Learn how to lint JavaScript in Visual Studio
09/29/2022
how-to
javascript
mikejo5000
mikejo
jmartens
vs-javascript
JavaScript
nodejs
>= vs-2022

Linting JavaScript in Visual Studio

Linting JavaScript and TypeScript in Visual Studio is powered by ESLint. If you are new to ESLint, you can begin by checking their documentation.

Enabling linting support

To enable linting support in Visual Studio 2022 or later versions, enable the Enable ESLint setting in Tools > Options > Text Editor > JavaScript/TypeScript > Linting.

Linting tools options page

In the options page, you can also modify the set of files that you want to lint. By default, all file extensions that can be linted (.js, .jsx, .ts, .tsx) will be linted.

You can override these options in some project types, like the standalone React project templates. In these projects, you can override the settings from the Tools > Options page using project properties:

Linting project properties

Installing ESLint dependencies

Once linting is enabled, the necessary dependencies need to be installed. This includes the ESLint npm package. This package can be installed locally in each project where you want to enable linting, or you can install it globally using npm install -g eslint. However, a global installation isn't recommended because plugins and shareable configs always need to be installed locally.

Depending on the files you want to lint, additional ESLint plugins may be needed. For example, you may need TypeScript ESLint, which enables ESLint to run on TypeScript code and includes rules that are specific to the extra type information.

When ESLint is enabled but the ESLint npm package isn't found, a gold bar is displayed that allows you to install ESLint as a local npm development dependency. Similarly, when an .eslintrc file has not been found, a gold bar is displayed to run a configuration wizard that will install the plugins applicable to the current project.

Install ESLint gold bar Run ESLint wizard gold bar

Disabling linting rules and auto-fixes

You can disable linting errors on a specific line or file. You can disable the errors by using the Quick Actions menu:

Linting code actions Disable linting rule

In addition, auto-fix code actions allow you to apply an auto-fix to address the respective linting error.

Troubleshooting

You can open the ESLint Language Extension pane in the Output window to see any error messages or other logs that might explain the problem.