Eslint Not Working in vs Code?
Eslint Is Not Working for Me in vs Code. I Have the Plugin Installed in vs Code, and Eslint Itself as a Developer Dependency in My Package. Json, Which I Have...
ESLint is not working for me in VS Code. I have the plugin installed in VS Code, and ESLint itself as a developer dependency in my package.json, which I have installed as well.
I modified the following option in the VS Code User Settings:
{
"eslint.options": { "configFile": "C:/mypath" }
}
I have use the command eslint --init to add the basic .eslintrc.json to the main directory of my package.
Other people were able to get ESLint feedback from VS Code using the exact same package with the exact same ESLint config file.
I have received no feedback of any kind when directly breaking multiple rules that were all included in the recommended rule set that is by default inside of the .eslintrc.json file.
What am I missing?
Edit: I have tested using ESLint via command line, and everything worked as expected, with the errors found where they should have, however, these same errors never showed up in VS Code. The issue seems to be on VS Code's side and not ESLint.
33 Answers
If ESLint is running in the terminal but not inside VSCode, it is probably
because the extension is unable to detect both the local and the global
node_modules folders.
To verify, press Ctrl+Shift+U in VSCode to open
the Output panel after opening a JavaScript file with a known eslint issue.
If it shows Failed to load the ESLint library for the document {documentName}.js -or- if the Problems tab shows an error or a warning that
refers to eslint, then VSCode is having a problem trying to detect the path.
If yes, then set it manually by configuring the eslint.nodePath in the VSCode
settings (settings.json). Give it the full path (for example, like
"eslint.nodePath": "C:\\Program Files\\nodejs") -- using environment variables
is currently not supported.
This option has been documented at the ESLint extension page.
In my case, since I was using TypeScript with React, the fix was simply to tell ESLint to also validate these files. This needs to go in your user settings:
"eslint.validate": [ "javascript", "javascriptreact", "html", "typescriptreact" ],
configuring working directories solved it for me, since I had multiple projects with own .eslintrc files openend in the same window.
Put this in your .vscode/settings.json
"eslint.workingDirectories": [
"./backend",
"./frontend"
],
thanks to this guy on github:
PS: useful command to list all subdirectories containing an .eslintrc except /node_modules:
find . .eslintrc | grep .eslintrc | grep -v node_modules
There are a few reasons that ESLint may not be giving you feedback. ESLint is going to look for your configuration file first in your project and if it can't find a .eslintrc.json there it will look for a global configuration. Personally, I only install ESLint in each project and create a configuration based off of each project.
The second reason why you aren't getting feedback is that to get the feedback you have to define your linting rules in the .eslintrc.json. If there are no rules there, or you have no plugins installed then you have to define them.
Case 1/2: First-time plugin installation? approval is necessary
Little "weird" user experience (Hard to notice) - anyway - Since V 2.1.10 -
You must change the "currently block" status bar on New/First installation.
ESLint plugin Version 2.1.10 changelog (08/10/2020)
no modal dialog is shown when the ESLint extension tries to load an ESLint library for the first time and an approval is necessary. Instead the ESLint status bar item changes to ESLint status icon indicating that the execution is currently block.
Click on the status-bar (Right-Bottom corner):
Opens this popup:
Approve ==> Allows Everywhere
-or- by commands:
ctrl + Shift + p -- ESLint: Manage Library Execution
Read more here under "Release Notes":
Sarah Jenkins is a veteran tech journalist with over 12 years of experience covering artificial intelligence, mobile innovations, and digital ethics. Her insights have appeared in leading technology publications worldwide.
