首页
前端开发
Typescript
prettier-plugin-sort-imports Prettier导入排序插件

prettier-plugin-sort-imports Prettier导入排序插件

0 次浏览 0 条评论
zip
zip

按正则顺序自动整理 import 的插件挺实用的，尤其是项目里模块多、导入杂的情况。 就是这样一个让人省心的工具，它是 prettier 的一个插件，可以直接在你原有格式化流程里加入 import 排序的逻辑。配置也不复杂，用几条正则就能把你那些 @core/xxx、utils/xxx 全部安排得明明白白。

你只需要在项目里装上它，像这样：

npm install --save-dev @trivago/prettier-plugin-sort-imports
或者你用的是 yarn，也可以：
yarn add --dev @trivago/prettier-plugin-sort-imports

在 .prettierrc 或者 prettier.config.js 里加点配置，比如：

module.exports = {
  printWidth: 80,
  tabWidth: 4,
  trailingComma: 'all',
  singleQuote: true,
  semi: true,
  importOrder: [
    '^@core/(.*)$',
    '^@server/(.*)$',
    '^[./]',
  ],
  importOrderSeparation: true,
  importOrderSortSpecifiers: true,
};

它支持自定义 import 分组，也能自动分行、对齐，适合配合 TypeScript、Prettier、ESLint 这套组合用。如果你有强迫症，对 import 的顺序讲究，这插件可以帮你省下不少手动调整的时间。

哦对了，和它差不多方向的还有个叫 prettier-plugin-organize-imports，不过它更偏向用 TypeScript 的语言服务来自动整理，不太适合复杂分组场景。

如果你在搞 Monorepo 或者团队协作项目，建议早点统一一下 import 的风格，越早用这种工具，越能避免后期的代码冲突和审查痛点。

zip 文件大小：1.09MB