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

Question

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

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

到

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

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

我发现了一个“no-restricted-imports”规则应该可以解决这个问题，但我只能限制“@material-ui/core”下的任何内容，因此“@material-ui/core/*”也受到限制。

我尝试了多种方法来设置规则，但所有这些方法都不适用于我的用例。即：

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

但两者都行不通。我是否错过了什么，或者只是无法实现？

Answer 1

我想用 lodash 做同样的事情。

对于 Treeshaking，我想限制

从“lodash”导入{get}；

但允许

从“lodash/get”导入 get；

为此进行 eslint 配置，

'no-restricted-imports': [
      'error',
      {
        paths: [
          {
            name: 'lodash',
            message:
              "Please use `import [package] from 'lodash/[package]'` instead."
          }
        ],
        patterns: ['!lodash/*']
      }
    ]

您可以为您的包裹尝试类似的操作。