Adding spaces between imports and braces in WebStorm

Is it possible to add spaces between imports and braces in WebStorm's auto-import feature?

Currently how the auto import looks like:

import {AbstractControl} from '@angular/forms';

I want to change it to:

import { AbstractControl } from '@angular/forms';

Yes. Go to WebStorm -> Preferences -> Editor -> Code Style -> JavaScript -> Spaces (second tab), scroll to section "Within" and check ES6 import/export braces.

• For javascript Project:

> Go to WebStorm > File > Settings > Editor > Code Style > > JavaScript > Spaces (second tab), scroll to section "Within" and > check ES6 import/export braces.

• For TypeScript Project:

> Go to WebStorm > File > Settings > Editor > Code Style > > TypeScript > Spaces (second tab), scroll to section "Within" and check > ES6 import/export braces.

While the other answers are correct, they are not portable. You have to remember to change IntelliJ on all machines you run the project. You can add an .editorconfig file to your project.

On your specific request for "IntelliJ/WebStorm" such can be achieved by putting this line on the file .editorconfig:

ij_typescript_spaces_within_brackets = true

---

To give you a better example of what an .editorconfig file can do, check the following:

• marks it as root (so editor will not look elsewhere)
• makes sure all files are utf-8
• if file matches given extension gives it some extra properties

root = true

[*]
charset = utf-8
[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
ij_typescript_spaces_within_brackets = true

You might want to check the Within interpolation expressions in the Other section of the Spaces tab.