Extension 'eslint' is configured as formatter but it cannot format 'JavaScript'-files

Question

I am experiencing an intermittent problem with ESLint in VS Code. When saving a file, instead of formatting it, this message shows in the status bar:

Apparently no one has ever reported this message on Google.

When I say it is intermittent, it was working fine, then the computer (MBP) crashed, and on restarting this is the situation. It has happened previously, but I don't recall what I did to fix it.

The app is a fairly complex Vue-based app based on a pre-configured template. In package.json:

    "@vue/cli-plugin-eslint": "^4.5.13",

    "babel-eslint": "^10.1.0",
    "eslint": "^7.31.0",
    "eslint-plugin-import": "^2.23.4",
    "eslint-plugin-vue": "^7.14.0",

In the VS Code workspace file:

        "editor.codeLens": true,
        "eslint.format.enable": true,
        "editor.codeActionsOnSave": {
          "source.fixAll.eslint": true,
        },
        "[javascript]": {
            "editor.defaultFormatter": "dbaeumer.vscode-eslint"
        },
        "[vue]": {
            "editor.defaultFormatter": "dbaeumer.vscode-eslint"
        },
        "eslint.validate": [
            "javascript"
        ],
        "debug.javascript.usePreview": true,
        "debug.javascript.usePreviewAutoAttach": true,
        "[jsonc]": {
            "editor.defaultFormatter": "dbaeumer.vscode-eslint"
        },

I'm really not sure how to proceed to understand why vscode-eslint is reporting that it can't format JavaScript files.

EDIT

This issue regarding TypeScript gives some hints. It seems this error can result when the ESLint server is restarting or the extension host is under a lot of stress.

In my project now, most files are formatting fine, although one consistently fails. That file is called eslint.js and is part of a build process, running eslint - I don't totally understand the configuration. I suspect that saving this file somehow causes eslint to be run/reloaded, and while that is happening, eslint-vscode tries to also run it and fails.

Answer 1

I was fighting with this for a while, turns out you need to head to Settings , under User go to Extensions > ESLint , scroll down to Format:Enable and enable ESLint as a formatter.

Settings:

Answer 2

I was actually experiencing the same problem and I only needed to remove the .eslintignore file, which only contained this line:

.eslintrc.js

You could simply comment that line too.

Hope that helps :)

Answer 3

This can happen for a variety of reasons. The eslint output logs will tell you the issue.

In my case the settings field configFile was changed to overrideConfigFile

Answer 4

In my case, this is because the eslint version installed is too old. It seems that some old version just cann't format javascript .

Answer 5

For me, it seemed as if StandardJS was trying to lint everything in my node_modules folder. The error went away and linting started working again after adding a standard.ignore property to my package.json , followed by reloading VSCode:

{
  "name": "foo",
  "devDependencies": {
    "standard": "^16.0.4"
  },
  "dependencies": {
    // stuff...
  },
  "standard": {
    "ignore": [
      "**/node_modules/**"
    ]
  }
}

No idea why this behavior didn't happen automatically...

---

UPDATE: I previously had installed eslint alongside standard , which may have been the root cause. My original install command was npm install standard eslint , which installed the latest version of eslint , v8.xx However, standard (at the time of writing) depends on eslint v7.xx, causing a conflict.

The fix:

~$ npm uninstall eslint # remove eslint from package.json
~$ rm -rf node_modules  # remove node_modules
~$ npm install          # get fresh installation

Answer 6

In my case this was even simpler than the other answers here: I forgot to create a .eslintrc.js file for this project. So running npx eslint --init fixed it. Copying the file from another project would also work.

Hope this helps someone like me googling this error and getting to this question.

Answer 7

1. Disable ESLint extension
2. Reload window
3. Enable ESLint extension
4. Do npm i eslint -g , also install ESLint on the project using npm i eslint -D
5. Make sure VSCode settings.json does not have another default default formatter for JavaScript

{
  "eslint.enable": true,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "dbaeumer.vscode-eslint",
  "editor.formatOnType": true,
  "[javascript]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint",
  }
}

6. Reload window

That worked for me

Answer 8

What worked for me was:

rm -rf node_modules
npm cache clean --force
npm install

Close VScode and then re-open