ESLint：如何使用“ no-restricted-imports”限制某些路径，但允许子路径？

编程问答 2022-06-06

问题描述

我正在使用Material-UI，并且正在从中切换所有导入

import { Button } from "@material-ui/core";

到

import Button from "@material-ui/core/Button";

我想添加一个皮棉规则，不允许直接从“ @ material-ui / core”导入，但允许任何子文件夹，例如“ @ material-ui / core / Button”。

我找到了应该解决的“无限制进口”规则，但是我只能限制“ @ material-ui / core”下的任何内容，因此“ @ material-ui / core / *”会受到限制也是

我尝试了几种设置规则的方法，但是对于我的用例，所有这些方法都失败了。即：

"no-restricted-imports": ["error","@material-ui/core"]
///////
"no-restricted-imports": ["error",{
    "patterns": ["@material-ui/core"]
}]

但是两者都不行。我是否缺少某些东西或只是无法实现？

解决方法

您可以对某些文件路径使用替代

"no-restricted-imports": ["error","@material-ui/core"],"overrides": [{
  "files": [...],"rules: {
    "no-restricted-imports": ["error",{
      "patterns": ["@material-ui/core"]
    }]
  },}],
eslinteslintjavascriptlintlint