Javascript ESLint 在 VS Code 中不起作用？

ESLint not working in VS Code?

提问by John Landon

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.

ESLint 在 VS Code 中对我不起作用。我在 VS Code 中安装了插件，并且 ESLint 本身作为我的 package.json 中的开发人员依赖项，我也安装了它。

I modified the following option in the VS Code User Settings:

我在 VS Code 用户设置中修改了以下选项：

{
  "eslint.options": { "configFile": "C:/mypath" }
}

I have use the command eslint --initto add the basic .eslintrc.jsonto the main directory of my package.

我已经使用该命令eslint --init将基本内容添加.eslintrc.json到我的包的主目录中。

Other people were able to get ESLint feedback from VS Code using the exact same package with the exact same ESLint config file.

其他人能够使用完全相同的包和完全相同的 ESLint 配置文件从 VS Code 获得 ESLint 反馈。

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.jsonfile.

在直接破坏所有包含在.eslintrc.json文件中默认推荐规则集中的多个规则时，我没有收到任何类型的反馈。

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.

编辑：我已经通过命令行使用 ESLint 进行了测试，一切都按预期工作，在应该出现的地方发现了错误，但是，这些相同的错误从未出现在 VS Code 中。问题似乎出在 VS Code 方面，而不是 ESLint。

采纳答案by EJ Mason

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.

ESLint 没有给你反馈的原因有几个。ESLint 将首先在您的项目中查找您的配置文件，如果在那里找不到 .eslintrc.json，它将查找全局配置。就我个人而言，我只在每个项目中安装 ESLint，并基于每个项目创建一个配置。

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.

您没有得到反馈的第二个原因是要获得反馈，您必须在 .eslintrc.json 中定义 linting 规则。如果那里没有规则，或者你没有安装插件，那么你必须定义它们。

回答by ParaBolt

If ESLint is running at the terminal but not inside VSCode, it is probable that the extension is unable to detect ESLint library from both the local and the global node modules folders.

如果 ESLint 在终端上运行但不在 VSCode 内运行，则扩展可能无法从本地和全局节点模块文件夹中检测到 ESLint 库。

To verify, Press CTRL+SHIFT+U at VSCode to go to the Output panel after opening a JS file in your project. If it shows "Failed to load the ESLint library for the document {{documentName}}.js", then it is having a problem trying to detect the path.

要进行验证，请在 VSCode 中按 CTRL+SHIFT+U 以在项目中打开 JS 文件后转到“输出”面板。如果它显示“无法加载文档 {{documentName}}.js 的 ESLint 库”，那么它在尝试检测路径时遇到了问题。

If yes, then set it manually by configuring the "eslint.nodePath" in settings. Give it the full path; using environment variables is currently not supported. This option has been documented at the ESLint extension page.

如果是，则通过在设置中配置“eslint.nodePath”手动设置。给它完整的路径；目前不支持使用环境变量。此选项已在ESLint 扩展页面中记录。

回答by Simone

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:

就我而言，由于我在 React 中使用 TypeScript，所以修复只是告诉 ESLint 也验证这些文件。这需要进入您的用户设置：

"eslint.validate": [ "javascript", "javascriptreact", "html", "typescriptreact" ],

回答by Karl Adler

configuring working directories solved it for me, since I had multiple projects with own .eslintrcfiles openend in the same window.

配置工作目录为我解决了这个问题，因为我有多个项目，.eslintrc在同一个窗口中打开了自己的文件。

Put this in your .vscode/settings.json

把这个放在你的 .vscode/settings.json

"eslint.workingDirectories": [
    "./backend", 
    "./frontend"
],

thanks to this guy on github: https://github.com/microsoft/vscode-eslint/issues/696#issuecomment-542592372

感谢 github 上的这个人：https: //github.com/microsoft/vscode-eslint/issues/696#issuecomment-542592372

PS: useful command to list all subdirectories containing an .eslintrcexcept /node_modules:

PS：列出所有包含.eslintrc除 /node_modules 之外的子目录的有用命令：

find . .eslintrc | grep .eslintrc | grep -v node_modules

find . .eslintrc | grep .eslintrc | grep -v node_modules

回答by atulkhatri

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

就我而言，我没有在 VSCode 中安装 ESLint 扩展，这导致了问题。做到了，它又开始工作了。

回答by dmudro

Since you are able to successfully lint via command line, the issue is most likely in the configuration of the ESLint plugin.

由于您能够通过命令行成功 lint，问题很可能出在 ESLint插件的配置中。

Assuming the extension is properly installed, check out all ESLint related config propertiesin both project (workspace) and user (global) defined settings.json.

假设扩展已正确安装，请检查项目（工作区）和用户（全局）定义的 settings.json 中所有与 ESLint 相关的配置属性。

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 globalsettings.json ended up looking following:

在您的特定情况下，有一些事情可能会被错误配置；对我来说，在另一个项目中使用 TypeScript 后禁用了 JavaScript，我的全局settings.json 最终看起来如下：

"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.

这很常见，以至于有人写了一篇关于ESLint 在 VS Code 中不起作用的直截了当的博客文章。我只是添加，在覆盖本地工作区配置之前检查您的全局用户 settings.json。

回答by Onengiye Richard

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.

如果您使用 ESLint 的全局安装，则配置中使用的任何插件也必须全局安装。像本地安装一样明智。如果您已在本地安装并在本地正确配置，但 eslint 不起作用，请尝试重新启动您的 IDE。这只是发生在我身上的 VScode。

回答by cimak

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

我在 Windows 上有类似的问题，但有时 eslint 工作（在 vscode 中）有时不工作。后来我意识到它在一段时间后工作正常。它与此问题有关：eslint 服务器需要大约 3-5 分钟才能可用

Setting enviroment variable NO_UPDATE_NOTIFIER=1solved the problem

设置环境变量NO_UPDATE_NOTIFIER=1解决了问题

回答by LasithaMD

I'm giving the response assuming that you have already defined rules in you local project root with .eslintrcand .eslintignore. After Installing VSCode Eslint Extension several configurations which need to do in settings.json for vscode

假设您已经在本地项目根目录中使用.eslintrc和.eslintignore定义了规则，我会给出响应。安装 VSCode Eslint Extension 后需要在 settings.json 中为 vscode 做几个配置

eslint.enable: true
eslint.nodePath: <directory where your extensions available>

eslint.enable: true
eslint.nodePath: <directory where your extensions available>

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.

将 eslint local 安装为项目依赖项是使其工作的最后一个因素。考虑不要将 eslint 安装为全局，这可能会与您本地安装的包冲突。

回答by PRS

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.

我有一个与 eslint 类似的问题，说它是“.. 尚未验证任何文件”，但在 VS Code 问题控制台中没有报告任何内容。但是在将 VS Code 升级到最新版本（1.32.1）并重新启动后，eslint 开始工作。