Starting from ReSharper 2022.2, active development of productivity features for JavaScript, TypeScript, JSON, CSS, and Protobuf is suspended, and these features are disabled by default. To enable them, select the corresponding checkboxes on the Environment | Products & Features page of ReSharper options Alt+R, O: JavaScript and TypeScript, CSS Language, and Protobuf.
ReSharper integrates with web code quality tools (also known as linters) — JSLint, ESLint, and TSLint — to help you detect and fix even more problems in your code.
Linters are designed as command-line tools, so normally each time you want to validate your code, you need to go to the console, run a command line, and then dig through its text output.
With ReSharper it is different. When a linter is installed and enabled in ReSharper settings, the linter code rules are used together with ReSharper's own code inspections, and all code issues detected by linters are highlighted right in the editor in design-time.
In most cases, ReSharper will find the Node.js interpreter automatically. If it is installed in an uncommon location, specify it on the Tools | Node.js page of ReSharper options Alt+R, O
Install the desired linter packages in your project.
Open the desired linter options pages under Tools | Web Linters and enable the linter.
If there is node_modules folder in your project, ReSharper will find linter packages automatically. But you can also specify a custom linter folder.
If you use ESLint or TSLint, ReSharper will take all rules and settings from linter configuration files. By default, these files are found automatically but you can also specify a custom configuration file.
If the automatic search is enabled and the linter does not work, make sure that the configuration files are in the current directory and/or its parent directories, or in the user home directory:
For ESLint: .eslintrc.* file or an eslintConfig field in a package.json.
For TSLint: tslint.json, tslint.yaml, or tslint.yml.
You can also pass any additional command-line options separated with spaces (see command line options reference for JSLint, ESLint, and TSLint).
Note that some options, which affect how the linter is executed cannot be applied. For example, --fix will be ignored because ReSharper provides its own way to apply the linter fixes.
If you use TSLint, ReSharper will enable the linter in TypeScript and JavaScript code by default. To use it in TypeScript code only, clear the corresponding checkbox.
When linter support is set up, you will see code issues detected by the linter highlighted in the editor according the severity level (error level) of the corresponding rule:
If the linter provides a fix for a rule, you will be able to apply it right from the AltEnter menu:
You can also choose Inspection: [name] | Configure inspection severity | [Severity level] from the AltEnter menu — this will write the new severity level (error level) for the corresponding rule right in the linter configuration file.
This feature is supported in the following languages and technologies:
Cookie Settings
Our website uses some cookies and records your IP address for the purposes of accessibility, security, and managing your access to the telecommunication network. You can disable data collection and cookies by changing your browser settings, but it may affect how this website functions. Learn more.
With your consent, JetBrains may also use cookies and your IP address to collect individual statistics and provide you with personalized offers and ads subject to the Privacy Notice and the Terms of Use. JetBrains may use third-party services for this purpose. You can adjust or withdraw your consent at any time by visiting the Opt-Out page.