Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Use custom eslint config file in VSCode that is managed via Yarn

I have eslint installed and running in VSCode, but it is not using our config file.

The settings I have changed are

{
  "eslint.nodePath": "C:\\Users\\PARAGON\\Documents\\AllCode\\ParagonCore\\clients\\utilities\\paragon-scripts\\node_modules",
  "eslint.options": {
    "configFile": "C:\\Users\\PARAGON\\Documents\\AllCode\\ParagonCore\\clients\\utilities\\paragon-scripts\\configuration\\.eslintrc.js",
  },
  "eslint.packageManager": "yarn",
}

UPDATE:

modified nodePath and fixed file path mistake

[Info  - 12:30:26 PM] ESLint library loaded from: 
C:\Users\PARAGON\AppData\Local\Yarn\config\global\node_modules\eslint\lib\api.js
[Error - 12:30:26 PM] Cannot read config file: C:\Users\PARAGON\Documents\AllCode\Paragon\ParagonCore\clients\utilities\paragon-scripts\configuration\.eslintrc.js Error: Cannot find module 'C:\Users\PARAGON\Documents\AllCode\Paragon\ParagonCore\clients\utilities\paragon-scripts\configuration\.eslintrc.js'
[Error - 12:32:56 PM] 
Failed to load plugin react: Cannot find module 'eslint-plugin-react'
Happened while validating C:\Users\PARAGON\Documents\AllCode\ParagonCore\clients\job-grid\source\scripts\components\AssignToUser.jsx
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
2. If ESLint is installed globally, then make sure 'eslint-plugin-react' is installed globally as well.
3. If ESLint is installed locally, then 'eslint-plugin-react' isn't installed correctly.

Consider running eslint --debug C:\Users\PARAGON\Documents\AllCode\ParagonCore\clients\job-grid\source\scripts\components\AssignToUser.jsx from a terminal to obtain a 
trace about the configuration files used.

Failed to load plugin react: Cannot find module 'eslint-plugin-react'
Happened while validating C:\Users\PARAGON\Documents\AllCode\ParagonCore\clients\job-grid\source\scripts\components\controls\CreateJob.jsx
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file 
(e.g. .eslintrc).
2. If ESLint is installed globally, then make sure 'eslint-plugin-react' is 
installed globally as well.
3. If ESLint is installed locally, then 'eslint-plugin-react' isn't installed correctly.

Consider running eslint --debug 
C:\Users\PARAGON\Documents\AllCode\ParagonCore\clients\job-
grid\source\scripts\components\controls\CreateJob.jsx from a terminal to 
obtain a trace about the configuration files used.
like image 692
Matt VS Avatar asked Mar 12 '18 20:03

Matt VS


People also ask

How do I configure ESLint in Visual Studio code?

Configure VSCode Settings to use ESLint for FormattingClick that tiny icon in the top-right that looks like a piece of paper with a little arrow. The first one turns on ESLint for formatting, and the next 3 make it do the formatting when you hit save. That should do it! Save the settings file and close it, we're done.

How do I create an ESLint configuration file?

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 fix ESLint issues in VS Code?

If you have the ESLint extension installed you can use CTRL+SHIFT+P to open the Command Palette. Then search for ESLint: Fix all auto-fixable Problems and press ENTER (or RETURN ). You are free from counting indentation and checking for quotation marks and semicolons!


1 Answers

First, make sure you do not have the package installed globally. Then, set "eslint.nodePath" to the location of your node_modules directory that is parallel to the configuration directory.

  1. yarn global remove eslint
  2. "eslint.nodePath": "C:/.../node_modules"
  3. open some files and look for "ESLint library loaded from:" in the Output window
like image 142
Nathan Bierema Avatar answered Oct 03 '22 05:10

Nathan Bierema