使用 prettier-plugin-sort-imports 优化 import 排序

使用 prettier-plugin-sort-imports 优化 import 排序

github
trivago/prettier-plugin-sort-imports: A prettier plugin to sort imports in typescript and javascript files by the provided RegEx order.

常用配置

.prettierrc.cjs

 importOrder: [
    "^react(.*)",
    "antd/(.*)",
    "",
    "@/(.*)",
    "^[./]"
  ],
  importOrderSeparation: true,
  importOrderSortSpecifiers: true
module.exports = {
  printWidth: 80,
  tabWidth: 2,
  trailingComma: "all",
  singleQuote: false,
  semi: true,
  importOrder: ["^@nestjs/(.*)$", "", "@/(.*)", "^[./]"],
  importOrderSeparation: true,
  importOrderSortSpecifiers: true,
  importOrderParserPlugins: [
    "typescript",
    "classProperties",
    "decorators-legacy",
  ],
};

错误记录

遇到格式化失效的时候,看是否有报错。
使用 prettier-plugin-sort-imports 优化 import 排序_第1张图片

Decorators Experimental Syntax Error · Issue #120 · trivago/prettier-plugin-sort-imports

eslint 也可以
eslint-plugin-import 真香 - 掘金

相关参考
How to quickly sort imports with Prettier - DEV Community
写一个同事见了会打你的 Prettier 插件 - 知乎

你可能感兴趣的:(前端)