使用typescript别名时，eslint导入/订单会发生故障

我正在一个大型项目中使用typescript路径别名。例如，在我的tsconfig.json中，我指定了一些路径别名：

{
“baseUrl”：“/src”，
“路径”：{
“@common/*”：[“common/*”]，
“@settings/*”：[“settings/*”]，
//其他途径
}
}

很好，现在当我想导入一些模块时，我可以使用这些别名。我们也在使用eslint，我们使用的规则之一是。它强制要求在任何本地模块之前导入来自节点_模块的任何内容。我喜欢这个规则。不使用我的别名：

import React，{useffect}来自“React”；
从“../common/components/SomeDistantComponent”导入SomeDistantComponent
从'Formik'导入{Formik}

这将抛出一个linting错误，但是根据eslint格式化文件将自动将formik导入移动到

SomeComponent

导入上方，这正是我想要的

但是，当使用我的别名时，这不会引发错误：

import React，{useffect}来自“React”；
从“@common/components/SomeComponent”导入SomeComponent
从'Formik'导入{Formik}

就好像typescript路径别名欺骗了

import/order

规则，而该规则现在崩溃了

问题：我的林特怎么还能识别这些别名路径？我是否可以配置此插件的

组

或

路径组

，以正确地对我的别名本地模块进行分组和排序，使其位于我的节点模块之后

奖金问题： 我不需要根据顺序区分别名模块和非别名模块。比如说

import React，{useffect}来自“React”；
从“./SomeCloseComponent”导入SomeCloseComponent
从“@common/components/SomeComponent”导入SomeComponent
从“./AnotherCloseComponent”导入另一个CloseComponent
从'Formik'导入{Formik}

只要

formik

导入在所有组件之前，我就可以保留

SomeCloseComponent

、

SomeComponent

和

另一个closecomponent

的导入顺序。是否可以将别名导入与非别名导入置于相同的“优先级”分组级别，这意味着它们不会在它们之间重新排序，而是都在节点\模块导入之后

编辑-再次尝试： 根据Aviv Hadar的回答，我在我的eslint文件中尝试了以下内容：

“导入/订购”：[
“警告”，
{
路径组：[
{
图案：“@material ui/**”，
组：“外部”，
位置：“之后”
},
{
模式：“@/**”，
集团：“内部”，
位置：“之后”
}
],
PathGroupsExcludeImportType:[“内部”、“外部”、“内置”]，
小组：[
“内置”，
“外部”，
“未知”，
[“内部”、“兄弟姐妹”、“父母”]，
“索引”，
“对象”，
“类型”
]
}
],

这是因为它将所有以

@

开头的导入视为内部导入，并将它们与其他内部导入保持在同一级别。所以这不会引起警告：

从“@some/aliased/path”导入{Something}”；
从“../../local”导入本地组件；
从“@other/aliased/path”导入{SomethingElse}；

这就是我想要的——所有内部模块都处于相同的分组级别，而不管别名与否，或者父/同级。但是，这应该会显示警告，但不会：

从“@some/aliased/path”导入{Something}”；
从“../../local”导入本地组件；
从“@other/aliased/path”导入{SomethingElse}；
从“@material ui/styles”导入{makestyles}

---

最后一次导入确实以

@

开始，但它是一个节点模块，应该位于列表的顶部。回想起来，我希望我们能选择一个不同的别名前缀，但我们没有。有没有办法调整我的配置以正确地将节点模块解释为

外部

，并将它们保留在该组中进行排序？

您需要使用

路径组

属性向

eslint

指示以

@/

开头的路径的正确位置在其他组之一之前/之后

我选择使用

~

符号而不是

@

，以区别从我的src文件夹导入和从以

@

开头的外部库导入，例如：

从'@materialui/core/styles'导入{makeStyles}；
从“~/components/Bar”导入条形图

现在，我的文件如下所示：

从“React”导入React；//外部的
从“~/components/Bar”导入条；//特别的
从“../Logo.svg”；/”导入{ReactComponent as Logo}父母亲
导入“./App.css”；//兄弟姐妹

这是我在

.eslintrc

文件中对

import/order

规则的定义：

“导入/订购”：[
“错误”，
{
“路径组”：[
{
“模式”：“~/**”，
“组”：“外部”，
“位置”：“之后”
}
],
“团体”：[
“内置”，
“外部”，
“内部”，
“未知”，
“家长”，
“兄弟姐妹”，
“索引”，
“对象”，
“类型”
]
}
]
}

如您所见，我正在使用

pathGroups

告诉eslint以

~/

开头的任何导入的正确位置都是

在
外部
组之后

因为这里的每个导入都属于不同的组，所以我对该顺序所做的任何更改都将导致ESLint错误

p.S.
我在某个时候遇到了进口问题，这些问题在我完成upda后得到了解决