Sorting imports
Which of these options is the best for sorting imports? I guess Prettier plugin because sorting imports it's more like the specialization of formatter?
1. trivago/prettier-plugin-sort-imports
2. Build-in to ESlint sort-imports
3. eslint-plugin-import (import/order)
4. eslint-plugin-simple-import-sort
2 Replies
What cons and pros, maybe in your experience you rated them and can say what is better in terms of ease of use or configurations.
I use '@ianvs/prettier-plugin-sort-imports', and I'm pretty happy with it. It seems the best option to me among others. Here is my prettier config for Next.js to make this plugin work as I need:
module.exports = {
// ...
importOrder: [
"^(next/(.)$)|^(next$)",
"^(react/(.)$)|^(react$)",
"<THIRD_PARTY_MODULES>",
"",
"^types$",
"^@/env(.)$",
"^@/types/(.)$",
"",
"^@/lib/(.)$",
"^@/hooks/(.)$",
"",
"^@/components/ui/(.)$",
"^@/components/(.)$",
"^@/app/(.*)$",
"",
"^[./]",
],
importOrderTypeScriptVersion: "5.0.0",
plugins: ["@ianvs/prettier-plugin-sort-imports"],
};