How to invoke the "Organize imports" TypeScript feature in Visual Studio?

Question

There is a new feature in TypeScript 2.8 that lets you "Organize imports": https://devblogs.microsoft.com/typescript/announcing-typescript-2-8-2/#organize-imports

Basically it does the following:

remove unnecessary import statements
sort the import statements

The page shows that the feature can be invoked in Visual Studio Code with the Shift+Alt+O keyboard shortcut. Does anybody know how this feature can be invoked in Visual Studio (2017)?

UPDATE:

From version 15.8 onward Visual Studio 2017 highlights unused imports by greying them out.

score 56 · Answer 1 · answered Feb 14 '19 at 12:56

56

Visual Studio Code has released a new feature in April last year which enable to organize imports on save. Can you try to update your current settings.json with the following changes:

"editor.formatOnSave": true,
"[typescript]": {
    "editor.codeActionsOnSave": {
        "source.organizeImports": true
    }
}

Hopefully this can be helpful and good luck!

answered Feb 14 '19 at 12:56

JayKan

3,966
2
20
21

1

is there a way to have it put an empty line between like-blocks? E.g., global imports, absolute path imports, relative imports all separate? – MrColes Jun 24 '20 at 01:41
Does it work for commonJS imports as well? I mean for packages imported using `require` keyword. – Kartik Chauhan Oct 01 '21 at 19:05
Beautiful. I also added `"source.removeUnusedImports": true`. – derpedy-doo Aug 09 '23 at 21:44

score 42 · Answer 2 · edited Feb 03 '20 at 18:56

42

You can also use the following shortcut with your keyboard to "Organize imports":

Shift+Alt+O

edited Feb 03 '20 at 18:56

Krisztián Balla

19,223
13
68
84

answered Feb 03 '20 at 16:03

Asif Billa

821
2
15
28

Is this for VS or VS Code? – Krisztián Balla Feb 03 '20 at 18:54
@JennyO'Reilly VSC – sunknudsen Mar 18 '20 at 16:17
2

Ok, thanks. The original question was for VS (not Code). – Krisztián Balla Mar 18 '20 at 18:07

score 23 · Answer 3 · answered May 03 '19 at 11:16

23

A slightly modified version of JayKan's answer but this worked for me in VSCode settings.json.

    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
        "source.organizeImports": true
    }

answered May 03 '19 at 11:16

Neil J

239
2
4

I think this must be accepted answer. Time saver answer. – kodmanyagha Jul 19 '23 at 14:13
Yes this is working for me too. Although I later switched it off as it was annoying me by deleting unused imports. Generally helpful, but a disaster when you are moving code between files, and thereby losing the relevant imports in the "old" file. Also a bit miserable when you bring a set of imports in from a template file and then try to write code that uses them. The ones you haven't used yet, keep disappearing. – ProfDFrancis Jul 23 '23 at 09:19

Krisztián Balla · Accepted Answer · 2021-07-14T07:58:10.553

19

This feature has now been added to Visual Studio 2017.

One can invoke it the following ways:

Pressing Ctrl+R followed by Ctrl+G.
Right-click in the code window and click Organize Imports in the context menu.

edited Jul 14 '21 at 07:58

answered Sep 11 '18 at 07:21

Krisztián Balla

19,223
13
68
84

Thomas Verschoof · Answer 5 · 2022-11-07T11:48:00.817

2

In Visual Studio 2022 (might even be in previous releases too) the option Organize Imports in the editor's code context menu has been renamed to Remove and Sort Usings, which still does the same thing and also remains available using the shortcut CTRL+R followed by CTRL+G.

Just in case anyone overlooked it, as I did.

edited Nov 07 '22 at 11:48

answered Nov 07 '22 at 11:46

Thomas Verschoof

21
2

The shortcut wasn't set, go to preferences -> Keyboard Shortcuts. I set mine to `cmd + shift + o` Thanks! – BatteryAcid Aug 04 '23 at 17:28

score -1 · Answer 6 · edited Jul 19 '18 at 07:02

-1

This is a feature of Visual Studio Code and not Visual Studio 2017.

edited Jul 19 '18 at 07:02

Krisztián Balla

19,223
13
68
84

answered Jul 19 '18 at 06:47

Sergey Rusakov

107
2

The Microsoft site says: "TypeScript’s language service now provides functionality to organize imports." So it should not be a feature of VS Code. Maybe it is not callable in VS 2017 yet. – Krisztián Balla Jul 19 '18 at 06:59
BTW. I use Resharper for Visual Studio. It has Code Cleanup function with import organizing feature for Typescript. However not so good as VS Code – Sergey Rusakov Jul 20 '18 at 08:04
VS Code merges and sorts multiple imports from same source into one line. Visual Studio doesn't. VS Code adds new imports as you type more accurately. VIsual Studio sometimes does, somethimes doesn't. Anycase, typescript in Visual Studio vs VS Code is a question of personal taste. – Sergey Rusakov Jul 21 '18 at 16:11
From version 15.8 onward Visual Studio 2017 now highlights unused imports by greying them out. – Krisztián Balla Aug 24 '18 at 07:41

How to invoke the "Organize imports" TypeScript feature in Visual Studio?

6 Answers6

Linked