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

Question

情况

在我们当前的项目中，我们遇到了一些反复出现的问题，人们在无缝不可变的情况下使用“asMutable”，但实际上并不需要。 这导致“字符串“asMutable”的搜索项目”成为每个拉取请求的一部分。 为了加快速度，我们想在我们的 eslint 中添加一个规则警告。 但我还没想好怎么做。

问题

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

附加说明

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

Answer 1

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

所以，首先，让我们解释一些基本结构：

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

因此，让我们首先创建一个带有规则的插件：

---

1. 为 Yeoman 使用 ESLint 生成器

这让事情变得容易多了。 在这里查看。

安装yeoman和yeoman eslint generator ：

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

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

---

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

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

当您将代码粘贴到AST Explorer 中时，它会向您显示ESLint所看到的内容。 我们要针对所有MemberExpression ：

something. asMutable ();

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

---

3. 编写插件本身

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

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

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 。 这使得此规则显示为警告而不是错误

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

这是我为此答案创建的插件

祝你好运！

Answer 2

当你将 ESLint 的no-restricted-syntax规则与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

在@Eric Simonton 的回答之上，从 ESLint 3.5.0 开始，我们有专门构建的无限制属性：

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

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