Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Visual Studio 2019 - Use project specific ESLint config .eslintrc

I have followed this guide to set up .eslintrc configuration.

https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/README.md

I have also enabled ESLint in Visual Studio by following this guide:

enter image description here

https://stackoverflow.com/a/44458832/3850405

My problem is that I want to use a project specific config instead of the Global ESLint Config.

The guide sets up a .eslintrc.js file so I tried to switch to a file that had the same structure as C:\Users\Oscar\.eslintrc.

Tried placing the .eslintrc in the root folder of the solution, project and in my ClientApp folder but nothing got picked up. Is it possible to use a project specific ESLint config in Visual Studio and receive build errors/warnings?

Running the command npx eslint . --ext .js,.jsx,.ts,.tsx gives me correct errors but Visual Studio shows no errors.

.eslintrc:

{
  "root": true,
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint",
    "jest"
  ],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:jest/recommended",
    "plugin:react/recommended"
  ],
  "env": {
    "browser": true,
    "node": true,
    "jest/globals": true
  },
  "rules": {
    "no-console": [
      "error",
      { "allow": [ "warn", "error" ] }
    ]
  }
}
like image 978
Ogglas Avatar asked Sep 24 '20 13:09

Ogglas


People also ask

How do I configure ESLint options?

There are two primary ways to configure ESLint: Configuration Comments - use JavaScript comments to embed configuration information directly into a file. Configuration Files - use a JavaScript, JSON, or YAML file to specify configuration information for an entire directory and all of its subdirectories.

How do I enable ESLint in Visual Studio?

A good way to do so is to add the following setting "[javascript]": { "editor.defaultFormatter": "dbaeumer.vscode-eslint" } for JavaScript. For TypeScript you need to add "[typescript]": { "editor.defaultFormatter": "dbaeumer.vscode-eslint" } .


1 Answers

I was able to get ESLint in Visual Studio 2019 to use a configuration file that I had in the root of my project. The file is called ".eslintrc.json". Here is the contents of the file so far:

{
  "extends": "eslint:recommended",
  "globals": {
    "kendo": "readonly"
  },
  "env": {
    "browser": true,
    "commonjs": true,
    "es6": true,
    "jquery": true
  },
  "rules": {
    "no-prototype-builtins": "off",
    "no-unused-vars": [
      "error",
      { "args": "none" }
    ]
  }
}

One thing I noticed is that I had close and re-open Visual Studio after adding the file before it would start working. Once I did that changes I made to the file would take effect immediately.

like image 59
phillhutt Avatar answered Oct 11 '22 20:10

phillhutt