Javascript 如何在VSCode中获取ESLint到lint HTML文件？_Javascript_Visual Studio Code_Eslint_Lint

Javascript 如何在VSCode中获取ESLint到lint HTML文件？

javascript visual-studio-code

Javascript 如何在VSCode中获取ESLint到lint HTML文件？,javascript,visual-studio-code,eslint,lint,Javascript,Visual Studio Code,Eslint,Lint,我有一个Javascript浏览器项目，分为多个文件，无法让ESLint将HTML文件的脚本标记放在同一个全局范围内，以便在另一个文件中识别一个文件中的类和函数的声明和调用以下是我的项目结构：以下是foo.js的内容： sayHello(); 和bar.js： function sayHello() { console.log('Hello'); } 我在HTML文件中链接了它们： <html> <head> <meta charset="

我有一个Javascript浏览器项目，分为多个文件，无法让ESLint将HTML文件的脚本标记放在同一个全局范围内，以便在另一个文件中识别一个文件中的类和函数的声明和调用

以下是我的项目结构：

以下是foo.js的内容：

sayHello();

和bar.js：

function sayHello() {
  console.log('Hello');
}

我在HTML文件中链接了它们：

<html>
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="main.css">
    <script src="libraries/bar.js" type="text/javascript"></script>
    <script src="foo.js" type="text/javascript"></script>
  </head>
  <body>
  </body>
</html>

我正在使用VSCode编辑器，但在终端中也遇到了相同的问题：

Alexs-MacBook-Pro:Demo alexmcdermott$ npx eslint --ext .js,.html .

/Users/alexmcdermott/GitHub/Demo/foo.js
  1:1  error  'sayHello' is not defined  no-undef

/Users/alexmcdermott/GitHub/Demo/libraries/bar.js
  1:10  error    'sayHello' is defined but never used  no-unused-vars
  2:3   warning  Unexpected console statement          no-console

✖ 3 problems (2 errors, 1 warning)

在VSCode中也是如此：

这是我的ESLint配置：

{
    "env": {
        "browser": true,
        "es6": true
    },
    "extends": "airbnb-base",
    "plugins": [ "html" ]
}

我还将VSCode配置为在HTML文件上运行ESLint，并在VSCode用户设置中使用以下选项：

{
    "eslint.autoFixOnSave": true,
    "eslint.options": {
        "extensions": [ ".js", ".html" ]
    },
    "eslint.validate": [
        "javascript",
        {
            "language": "html",
            "autoFix": true
        }
    ]
}

虽然我一定是做错了什么，或者我错过了eslint插件html的要点？如果有人对我做错了什么或如何纠正这一点有任何意见，我将不胜感激，因为我已经坚持了很久了。如果我需要提供更多信息，请告诉我，我是新手。

我在

/.vscode/settings.json中有这个
{
  "eslint.validate": [ "javascript", "html" ]
}

我使用的.eslintrc.js
如下所示
module.exports = {
  "env": {
    "browser": true,
    "es6": true
  },
  "plugins": [
    "eslint-plugin-html",
  ],
  "extends": "eslint:recommended",
  "rules": {
  }
};

我定义了很多规则，但没有将它们粘贴到上面
结果:

打开.html
文件
打开输出面板
选择ESLint通道
查看错误并修复它们

使用：
运行npm安装eslint插件html——在终端中保存dev
打开.eslintrc.js
并在module.exports
之后添加插件：[“html”]
。如果您有.json
或与.js
不同的格式，那么只需按照模式在相同的嵌套级别上添加相同的值
在终端中运行/node\u modules/.bin/eslint--ext.html.
尝试使用htmlhint。它可以很好地过滤html文件
 添加了我的.eslintrc.js
。我很确定插件部分可以是“html”。你安装了它，对吗<代码>npm安装--保存开发人员eslint插件html

？您好，感谢您的回复。如果你看最后两张照片，我相信我也有。我只是在用户设置中指定了验证，而不是在VSCode的工作场所设置中。虽然我也试过你的方法，但没用。我知道它引用的是我的配置文件，因为它会对每个文件进行其他语法更改，例如替换分号，但它无法跨Javascript文件工作。是的，我已经安装了它。我已将npm列表输出的副本放在问题中，以便您可以查看已安装的软件包及其版本这是我在重新启动[Info-10:51:04 AM]ESLint服务器时在ESLint输出选项卡中获得的所有内容。[Info-10:51:04 AM]在节点v8.9.3中运行的ESLint服务器[Info-10:51:04 AM]ESLint服务器正在运行。[信息-上午10:51:06]加载自：/Users/alexmcdermott/GitHub/Demo/node_modules/ESLint/lib/api.js的ESLint库添加了我如何测试的屏幕截图。只是做了一个test.html，一个脚本标记，输入了一些JS。嗨，我只是尝试了you's suggestion，在我的html文档上的ESLint out面板中没有任何错误，然后是idk。可能是这个的复制品我不相信是复制品。我没有遇到这样的错误。如果我卸载eslint插件html扩展，我会得到这个错误，但一旦我重新安装它，它就会消失。看来ESLint可以看到这个插件，但不知什么原因它不起作用？

module.exports = {
  "env": {
    "browser": true,
    "es6": true
  },
  "plugins": [
    "eslint-plugin-html",
  ],
  "extends": "eslint:recommended",
  "rules": {
  }
};