如何在eslint-plugin-import中添加多个路径模式？

Question

我打算使用eslint来强制我的导入(import)按照标准顺序进行。

我已经实现了这一点，但是由于我设置了许多不同的路径以及TypeScript别名，我希望eslint规则在对外部包排序时排除它们，这导致了一个很长的eslint文件。

目前我的实现方式如下:

"import/order": [
  "error",
  {
    "groups": ["builtin", "external", "internal"],
    "pathGroups": [
      {
        "pattern": "react*",
        "group": "external",
        "position": "before"
      },
      {
        "pattern": "Components/**",
        "group": "internal"
      },
      {
        "pattern": "Constants/**",
        "group": "internal"
      }
      ... more patterns here
    ],
    "pathGroupsExcludedImportTypes": ["react", "internal"],
    "alphabetize": {
      "order": "asc",
      "caseInsensitive": true
    }
  }
],

我想知道是否有一种方法可以对这些模式进行分组，这样我就可以采取更类似于以下方式的操作：

"import/order": [
  "error",
  {
    "groups": ["builtin", "external", "internal"],
    "pathGroups": [
      {
        "pattern": "react*",
        "group": "external",
        "position": "before"
      },
      {
        "pattern": "Components/**|Constants/**|AnotherAlias/**|AnotherAlias/**",
        "group": "internal"
      }
    ],
    "pathGroupsExcludedImportTypes": ["react", "internal"],
    "alphabetize": {
      "order": "asc",
      "caseInsensitive": true
    }
  }
],

- user3284707

Answer 1

该模式是一个minimatch模式。如您所见，使用this（我认为）非官方测试工具，要使该模式匹配一组字符串中的某个字符串，您应该使用集合运算符：

{string1,string2,string3}

在您的情况下，您可以这样写：

//...
"pathGroups": [
      {
        "pattern": "react*",
        "group": "external",
        "position": "before"
      },
      {
        "pattern": "{Components,ConstantsAnotherAlias,AnotherAlias}/**",
        "group": "internal"
      }
    ],
//...

我不确定这会解决你的问题。 我通过正确设置 eslint 设置 import/internal-regex 来解决了它。 这个设置告诉 eslint，然后插件（如你可以在 这里 看到的那样）如何判断一个导入是否是内部的。 所以你可以这样设置：

//...
"settings": {
  "import/internal-regex": "(Components|Constants|AnotherAlias|AnotherAlias)(/.+)?"
}
//...

- balsick