如何使用 ESlint 禁止特定的命名函数

Question

情况

在我们当前的项目中，我们遇到了一些反复出现的问题，即人们使用 seamless-immutable 中的 'asMutable' 而实际上并不需要。这导致 'search project for string "asMutable"' 成为每个拉取请求的一部分。为了加快速度，我们想在我们的 eslint 中添加一条警告规则。但是我还没想好怎么办。

问题

尽管我乐于接受建议，但目前对我来说最好的解决方案是允许我指定要禁止的函数名称的规则。 ESlint 或插件是否具有这种功能？

补充说明

我已经考虑过编写我们自己的规则，但我被 AST 和编写我的第一条规则的启动困难吓倒了。如果我找不到更好的答案，我可能会冒险，是的，我们在 PR 中得到了足够多的答案来保证它。不过，这似乎比我聪明得多的人已经解决了，所以我宁愿追随他们的脚步，然后建立自己的。

Answer 1

不久前我遇到了同样的问题，所以我可以帮助您编写自己的问题。

那么，首先，让我们解释一些基本结构：

ESLint 有插件，每个插件有 rules.
ESLint 使用 AST 这是一个 语法树 来查找代码中的特定部分。这有助于 ESLint 找到每个规则正在寻找的内容。

那么，让我们开始创建一个带有规则的插件：

1。使用 Yeoman 的 ESLint 生成器

这让事情变得容易多了。看看 here.

安装 yeoman 和 yeoman eslint generator 后：

进入您要在其中创建项目的文件夹
运行 yo eslint:plugin 创建一个新的 ESLint 插件
创建插件后，运行 yo eslint:rule 在同一文件夹中

我使用 suni 作为插件名称，check-as-mutable 作为规则名称。现在我们有了编写规则所需的所有初始文件。

2。使用 AST Explorer 了解您需要查找的内容

AST Explorer 可以帮助我们找到我们要找的类型的东西。这很重要，因此我们可以告诉 ESLint 我们希望我们的函数在代码中的什么运行。

当您将代码粘贴到 AST Explorer 时，它会向您显示 ESLint 所看到的内容。我们要定位所有 MemberExpressions:

something.asMutable();

在里面，我们希望Identifier node检查函数名

3。自己写插件

打开 lib/rules/check-as-mutable.js 并查看。您为 Yeoman 提供的所有数据都用于填写此处的一些字段。

在规则中，您有一个 create 属性。在这里，我们编写代码。这个函数应该 return 一个对象，我们希望我们的规则运行作为属性。所以，在这种情况下，它看起来像这样：

create: function(context) {

    return {
      MemberExpression: function(node)...

    };
}

在编写规则时，您应该使用 AST Explorer.

检查您需要哪些字段

这里是实现：

create: function(context) {
  var UNWANTED_FUNCTION_NAME = 'asMutable';
  return {
    MemberExpression: function reportUnwantedName(node) {
      var functionName = node.property.name;

      if (functionName === UNWANTED_FUNCTION_NAME) {
        context.report({
          node: node,
          message: [
            'Please don\'t use ',
            UNWANTED_FUNCTION_NAME,
            '. We don\'t like it!'].join('')
        });
      }
    }
  };
}

之后，您需要在项目中安装插件。为此，请将其上传到 GitHub，然后使用 npm:

安装它

npm install --save-dev <user_name>/<repository_name>

并将规则也包含在您的 .eslintrc 文件中：

{
    'plugins': ['suni'],
    'rules': {
      'suni/check-as-mutable': 1
    }
}

注意我给它的值是 1。这使得此规则显示为 Warning 而不是 Error

请注意，警告突出显示了 Immutable 本身，因为那是我们传递给 context.report 的 node。您可以调整它以突出显示 id node。

Here's the plugin I created for this answer

祝你好运！

Answer 2

结合 ESLint 的 no-restricted-syntax rule with selectors，你可以做一些非常奇特的事情。在你的情况下，你应该能够在不编写自己的插件的情况下实现你想要的 linting。该规则类似于：

{
  rules: {
    'no-restricted-syntax': [
      'error',
      {
        message: "Please don't use asMutable. We don't like it!",
        selector:
          'MemberExpression > Identifier[name="asMutable"]'
      }
    ]
  }
}

研究 selectors 的文档页面；非常灵活！

Answer 3

在, since ESLint 3.5.0 we have the purpose-built no-restricted-properties之上：

"no-restricted-properties": [ "error", {
    "object": "Immutable",
    "property": "asMutable",
    "message": "optional explanation to the recurring problems we've had"
}]

如果有人来这里寻找方法来阻止不是 class 方法的函数，您可以类似地使用 no-restricted-globals

如何使用 ESlint 禁止特定的命名函数

How to forbid a specific named function with ESlint

javascript

eslint

seamless-immutable

情况

问题

补充说明

1。使用 Yeoman 的 ESLint 生成器

2。使用 AST Explorer 了解您需要查找的内容

3。自己写插件