顾名思义,是对导入的模块进行排序,效果如下:
对比排序前后代码,排序后的代码看起来更整洁,react**全家桶
、外部库
、公共组件
、子组件
、api
、工具类
依次排列。
常用规则配置
{
"import/order": ["error", {
"groups": [
"builtin",
"external",
["internal", "parent", "sibling", "index"],
"unknown",
],
"pathGroups": [
{
"pattern": "@app/**",
"group": "external",
"position": "after"
}
],
"pathGroupsExcludedImportTypes": ["builtin"],
"newlines-between": "always",
"alphabetize": {
"order": "asc",
"acseInsensitive": true
}
}]
}
其中,group
是对导入模块进行分组,pathGroups
是通过路径自定义分组,newlines-between
不同组之间是否进行换行,alphabetize
根据字母顺序对每个组内的顺序进行排序
重点介绍下 pathGroups
属性,该属性有 4 个子属性:
- pattern:当前组中模块的最短路径匹配
- patternOptions:如果需要更精确的匹配,看这里
- group:在规定的组中选其一,
index
、sibling
、parent
、internal
、external
、builtin
、object
、type
、unknown
- position:定义组的位置,
after
、before
关于 pathGroupsExcludedImportTypes
的作用愣是没看懂,欢迎大家补充。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。