VS-Code: How to sort imports in specific order to go along with InteliJ

user_11677087 0
Viewed 12788

I am working in a team which mostly uses InteliJ. There imports get automatically sorted after the path. So "@namespace" goes first then less nested imports "./" > "../../" and on the same level its alphabetical.

Until now I used the "source.organizeImports" setting from VSCode which sorted the imports for named and default imports. This cant be customized as stated in another SO question and is not listed here: https://code.visualstudio.com/docs/languages/typescript#_organize-imports

I tried the VSC extension vsc-organize-imports but that doesnt have that option either. I would like to avoid to configure and run esLint to fix my import order. Any other suggestions, setting or extension I could try?

vscode-settings visual-studio-code import
2 Answers

You can install a vs-code extension sort-imports to achieve the sorting of imports.

user_84069030

In another project I have taken another look into this matter. The only solution is to turn the VSC organize import feature off and let the formatter/linter do the work. As I dont like my linter on autofix and I generally think its the job of the formatter and everyone should have one heres my solution:

  • In a TS project I used prettier-plugin-organize-imports. This prettier plugin mimicks the formatting order of the organize imports feature, so its basically the same. Very nice, except it has a TS peer dependency.

Therefore a second solution for JS projects:

  • Use the prettier plugin prettier-plugin-import-sort. This plugin needs you to add an order style of your choice with it. But it supports vanilla JS

As mentioned I have also found rules for eslint with an autofix, but I dont like that solution. The above packages fix the problem if you are using prettier.

user_116770870
Related