eslint中globals和env有什么区别？

在 ESLint 中，globals 和 env 都是配置选项，用于控制全局变量的可用性和环境设置，但它们有不同的用途和作用范围。下面是它们的区别和各自的用法：

globals

globals 用于声明自定义的全局变量及其读写属性（只读或可写）。它主要用于告诉 ESLint 代码中使用的全局变量，以防止 ESLint 报告未定义变量的错误。

• 作用：声明代码中使用的自定义全局变量。

• 属性：

  • readonly：变量是只读的，不能被重新赋值。
  • writable：变量是可写的，可以被重新赋值。

• 示例：

  module.exports = {
    globals: {
      myGlobalVar: 'readonly',  // 声明只读的全局变量
      anotherGlobalVar: 'writable'  // 声明可写的全局变量
    }
  };
  

• 使用场景：

  • 项目中使用了特定的全局变量，这些变量不属于任何标准环境（如浏览器或 Node.js），需要显式声明。
  • 防止 ESLint 报告未定义变量的错误。

env

env 用于设置代码运行的环境，这会影响哪些预定义的全局变量可用。例如，browser 环境会启用像 window 和 document 这样的全局变量，而 node 环境会启用 require 和 module 等全局变量。

• 作用：指定代码运行的环境，启用相应的预定义全局变量。

• 常见环境：

  • browser：启用浏览器全局变量，如 window、document。
  • node：启用 Node.js 全局变量，如 require、module。
  • es6：启用 ES6 全局变量和特性，如 Set、Map。
  • jest：启用 Jest 测试框架的全局变量，如 describe、it。

• 示例：

  module.exports = {
    env: {
      browser: true, // 启用浏览器环境
      node: true,    // 启用 Node.js 环境
      es6: true      // 启用 ES6 环境
    }
  };
  

• 使用场景：

  • 项目代码运行在特定的环境中，需要启用对应环境的全局变量。
  • 方便在不同的文件或项目中应用不同的环境配置，减少全局变量声明的重复。

综合示例

在某些情况下，你可能需要同时使用 globals 和 env 选项。例如，你有一个在浏览器和 Node.js 中运行的项目，并且还定义了一些自定义的全局变量：

module.exports = {
  env: {
    browser: true, // 启用浏览器环境
    node: true,    // 启用 Node.js 环境
    es6: true      // 启用 ES6 环境
  },
  globals: {
    myGlobalVar: 'readonly',  // 声明只读的全局变量
    anotherGlobalVar: 'writable'  // 声明可写的全局变量
  },
  rules: {
    // 其他规则配置
  }
};

在这个配置中：

• env 配置启用了浏览器和 Node.js 环境，因此 ESLint 会自动识别这些环境中的预定义全局变量。
• globals 配置声明了两个自定义的全局变量，一个是只读的，另一个是可写的。

总结

• globals：用于声明自定义的全局变量及其读写属性，以防止 ESLint 报告未定义变量的错误。
• env：用于指定代码运行的环境，启用相应的预定义全局变量。

这两者通常结合使用，以便更灵活和准确地控制全局变量的可用性和代码的环境设置。