如何在没有 ESLint no-unused-var 错误的情况下公开全局 javascript 函数？

Question

以下代码在 ESLint 中有效，具有 Google 的风格指南，但有一个例外；当使用 ESLint 检查脚本时，闭包函数 Counter 得到一个 no-unused-vars 错误。

/**
 * Create a counter that is incremented and returned when called
 * @return {object} - incrementor function
 */
function Counter() {
  var _i = 0;

  /**
   * increment counter
   * @return {int} - The incremented integer
   */
  function _incrementor() {
    _i++;
    return _i;
  }

  _incrementor.incr = function() {
    this.call();
    return _incrementor;
  };

  _incrementor.val = function(val) {
    if (!arguments.length) { return _i; }
    _i = val;
    return _incrementor;
  };

  return _incrementor;
}

我希望将此功能（或一种结构相同的方式）作为一个独立的脚本，我可以将其包含在我的 HTML 中，然后从不同的脚本调用，如下所示：

var count = Counter()
    .val(5);

count.incr() 
console.log(count.val())  // prints => 6

我已尝试在脚本顶部包含 /* exported Counter */，但错误仍然存在。我如何silence/fix这个错误？

Answer 1

将 Counter 显式添加到全局范围可消除此错误并防止可能因问题中使用的隐式全局范围而发生的错误。

/**
 * Create a counter that is incremented and returned when called
 * @return {object} - incrementor function
 */
this.Counter = function() {
  var _i = 0;

  /**
   * increment counter
   * @return {int} - The incremented integer
   */
  function _incrementor() {
    _i++;
    return _i;
  }

  _incrementor.incr = function() {
    this.call();
    return _incrementor;
  };

  _incrementor.val = function(val) {
    if (!arguments.length) {
      return _i;
    }
    _i = val;
    return _incrementor;
  };

  return _incrementor;
};

Answer 2

以下是告诉 linter 允许全局计数器变量的一些选项：

选项#1：需要使用全局变量时在js文件顶部添加此注释：

/* globals Counter */

选项 #2: 在你的 eslint 配置文件中将变量名添加到全局属性:

// eslintrc.js

module.exports = {
  // ...

  globals: {
    'Counter': true
  }
}

有关详细信息，请参阅 ESLint documentation here。

注意：您还可以在配置文件中使用 env 属性预定义的全局变量集，例如：浏览器（即 localStorage），jquery 、节点等）。参见 here。

如何在没有 ESLint no-unused-var 错误的情况下公开全局 javascript 函数？

How do you expose a global javascript function without ESLint no-unused-var error?

javascript

closures

eslint