ESLint not working in VS Code

Question

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

User · Answer

If you are using a global installation of ESLint  any plugins used in your configuration must also be installed globally  Like wise for local install  if u have installed locally and properly configured locally  yet eslint isn t working  try restarting your IDE  This just happened to me with VScode

User · Answer

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  quot eslint nodePath quot    quot C   Program Files  nodejs quot    -- using environment variables is currently not supported  This option has been documented at the ESLint extension page

User · Answer

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  https   github com microsoft vscode-eslint issues 696 issuecomment-542592372  PS  useful command to list all subdirectories containing an  eslintrc except  node modules   find    eslintrc   grep  eslintrc   grep -v node modules

User · Answer

For me  i did accidentally disable ESLint when some prompt was shown by it  Doing below steps fixed it for me  Shift   Command   P and select ESLint  Disabled ESLint Close vscode Shift   Command   P and select ESLint  Show Output Channel

User · Answer

If you are developing a project with eslint as an package json dependency  make sure you run npm install  That fixed it for me

User · Answer

In my case ESLint was disabled in my workspace  I had to enable it in vscode extensions settings

User · Answer

In my case  I had not installed he ESLint extension in VSCode  which was causing issue  Did it and it started working again

User · Answer

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

User · Answer

I m giving the response assuming that you have already defined rules in you local project root with  eslintrc and  eslintignore  After Installing VSCode Eslint Extension several configurations which need to do in settings json for vscode  eslint enable  true eslint nodePath   lt directory where your extensions available gt   Installing eslint local as a project dependency is the last ingredient for this to work  consider not to install eslint as global which could conflict with your local installed package

User · Answer

Restarting VSCode worked for me

User · Answer

In my case  it wasn t working because I had added only one folder of the monorepo to the project  even though I had the package json and the extension configured  I worked only when I added the whole project  which contained the package json file  to the VS Code

User · Answer

Go to your settings json file  add the following and  fix the eslint nodepath  Tailor it to your own preferences      PERSONAL    quot editor codeActionsOnSaveTimeout quot   2000     quot editor codeActionsOnSave quot          quot source fixAll quot   true         quot editor fontSize quot   16     quot editor formatOnSave quot   true     quot explorer confirmDragAndDrop quot   true     quot editor tabSize quot   2     quot eslint codeAction showDocumentation quot          quot enable quot   true         quot eslint nodePath quot    quot C    path  quot      quot eslint workingDirectories quot     quot   backend quot    quot   frontend quot

User · Answer

I use Use Prettier Formatter and ESLint VS Code extension together for code linting and formating       now install some packages using given command  if more packages required they will show with installation command as an error in the terminal for you  please install them also   npm i eslint prettier eslint  5 16 0 eslint-config-prettier eslint-plugin-prettier eslint-config-airbnb eslint-plugin-node eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks  2 5 0 --save-dev   now create a new file name  prettierrc in your project home directory  using this file you can configure settings of the prettier extension  my settings are below        singleQuote   true     now as for the ESlint you can configure it according to your requirement  I am advising you to go Eslint website see the rules  https   eslint org docs rules    Now create a file name  eslintrc json in your project home directory  using that file you can configure eslint  my configurations are below        extends     airbnb    prettier    plugin node recommended       plugins     prettier       rules          prettier prettier    error        spaced-comment    off        no-console    warn        consistent-return    off        func-names    off        object-shorthand    off        no-process-exit    off        no-param-reassign    off        no-return-await    off        no-underscore-dangle    off        class-methods-use-this    off        prefer-destructuring     error      object   true   array   false          no-unused-vars     error      argsIgnorePattern    req res next val

User · Answer

I had a similar problem with eslint saying it was    not validating any files yet   but nothing was reported in the VS Code problems console  However after upgrading VS Code to the latest version  1 32 1  and restarting  eslint started working

User · Answer

General issues Open the terminal Ctrl   Under  output ESLint dropdown  you find useful debugging data  Errors  warnings  info    For example  missing  eslintrc- json throw this error   Error  ENOENT  no such file or directory  realpath  Next  check if the plugin enabled   Last  Since v 2 0 4 - eslint validate in normal cases not necessary anymore  old legacy setting    eslint probe   an array for language identifiers for which the ESLint extension should be activated and should try to validate the file  If validation fails for probed languages the extension says silent  Defaults to  javascript  javascriptreact  typescript  typescriptreact  html  vue  markdown    Specific Issue - First-time plugin instalation My issue was related to the ESLint plugin  quot currently block quot  status bar   on New First instalation  v2 1 14   Since ESLint plugin Version 2 1 10  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    gt  Allows Everywhere  -or- by commands  ctrl   Shift   p -- ESLint  Manage Library Execution  Read more here under  quot Release Notes quot   https   marketplace visualstudio com items itemName dbaeumer vscode-eslint

User · Answer

Since you are able to successfully lint via command line  the issue is most likely in the configuration of the ESLint plugin   Assuming the extension is properly installed  check out all ESLint related config properties in both project  workspace  and user  global  defined settings json   There are a few things that could be misconfigured in your particular case  for me it was JavaScript disabled after working with TypeScript in another project and my global settings json ended up looking following    eslint validate          language    typescript    autoFix   true        From here it was a simple fix    eslint validate          language    javascript    autoFix   true         language    typescript    autoFix   true       This is so common that someone wrote a straight forward blog post about ESLint not working in VS Code  I d just add  check your global user settings json before overriding the local workspace config

User · Answer

In my case  I had the  eslintrc json file inside the  vscode folder  Once I moved it out to the root folder  ESLint started working correctly

User · Answer

I had similar problem on windows  however sometimes eslint worked  in vscode  sometimes not  Later I realized that it works fine after a while  It was related to this issue  eslint server takes  3-5 minutes until available Setting enviroment variable NO UPDATE NOTIFIER 1 solved the problem

User · Answer

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

User · Answer

In my case setting eslint validate to    eslint validate      javascript    javascriptreact    html    typescriptreact     did the job

[javascript] ESLint not working in VS Code?

Examples related to javascript

Examples related to visual-studio-code

Examples related to eslint