使⽤eslint⾃动调整import代码顺序
import语句CSDN 中⽂章不⼀定能及时更新，欢迎关注我的博客查看最新版本：
随着项⽬代码量的增多，每个 js/ts ⽂件头部都会有⼀堆 import 代码。
之前都是依赖 webstorm 的⾃动导⼊功能，然后⼿动调整下顺序，将 node_modules 中引⼊代码和项⽬⽬录中的引⼊代码区分开就⾏，反正webstorm 默认打开⽂件的时候，会把上⾯的⼀堆 import 代码给折叠起来。
⽽写 go 的时候，goland 可以⾃动调⽤ go fmt ，将 import 部分的代码也优化优化。
最近想着把编码规范再制定的细致⼀点，正好把这个问题也解决下。
eslint ⾃带规则
但是实际使⽤下来，发现功能有限，针对多⾏的 import 语句，⽆能为⼒，⽂档描述如下：
第三⽅插件
既然官⽅的能⼒不够强，就考虑下第三⽅插件了，⼀番检索，发现了 eslint-plugin-simple-import-sort 这个插件。
提供 sort-imports 能⼒的插件有好⼏个，试了⼀下，eslint-plugin-simple-import-sort 最靠谱。
安装
yarn add -D eslint-plugin-simple-import-sort
配置
在 .eslintrc 中分别加⼊：
{
"plugins":["simple-import-sort"]
}
{
"rules":{
"simple-import-sort/imports":"error",
"simple-import-sort/exports":"error"
}
}
体验
执⾏ eslint --fix src/**，完美。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。