Is there a keybinding in vscode for add import to an existing import statement or how to add imports on the fly in vscode?

Question

Seems like current extensions on VSCode marketplace can not properly add angular imports. For instance, when I add OnInit using Path IntelliSense extension

export class AppComponent implements OnInit

It imports it from

import { OnInit } from '@angular/core/core'

Instead of

import { OnInit } from '@angular/core'

As it should. I tried looking through extensions on the marketplace but failed to find anything remotely workable. I noticed however that VSCode provides a functionality to add to an existing import statement which you can see in the screenshot here

Is there any way to use a keybinding for this without the need to click a yellow light bulb when it appears and manually selecting it? And/Or do you perhaps know a great extension that adds Angular imports correctly like WebStorm does? (one of few reasons I am still resorting to use WebStorm over VSCode that is lighter & faster).

Answer 1

When your cursor is at the type you want to import, you can press ⌘ + . (I guess on Windows it's Ctrl + . ).

This is possible with TypeScript 2.2. Before that, a lot of people used this extension: https://marketplace.visualstudio.com/items?itemName=rbbit.typescript-hero