如何让ESLint识别本地文件？非Node.js项目no-undef报错解决

这个问题我之前在浏览器端项目里也碰到过——ESLint默认只会检查当前文件内定义的变量，完全不知道你通过外部<script>标签引入的全局变量，所以才会触发'myLibVar' is not defined的错误。这里有几个简单可行的解决办法：

方法1：在ESLint配置文件中全局声明（推荐） #

这是一劳永逸的方案，配置一次整个项目都生效。找到你的ESLint配置文件（比如.eslintrc.js、.eslintrc.json），添加globals字段：

{
  "env": {
    "browser": true // 记得开启浏览器环境，让ESLint识别window、document这类浏览器原生全局变量
  },
  "globals": {
    "myLibVar": "readonly" // readonly表示该变量是只读的，禁止重新赋值；如果需要修改则用"writable"
  }
}

方法2：在目标文件顶部加注释声明 #

如果只是单个文件需要用到这个全局变量，或者不想修改全局配置，可以在main.js的最顶部添加一行注释：

/* global myLibVar */
// 接下来就能正常使用myLibVar了
console.log(myLibVar);

如果有多个外部全局变量，还可以用逗号分隔：/* global myLibVar, anotherLibVar */

方法3：通过window访问全局变量（不推荐但可用） #

浏览器环境下的全局变量都会挂载到window对象上，所以你也可以写成window.myLibVar来访问，ESLint会识别window是浏览器原生全局对象，不会再报错。不过这种写法会让代码显得冗余，而且如果后续变量不是挂载在window上就会失效，所以优先推荐前两种方法。

内容的提问来源于stack exchange，提问作者t.m.