how to align javascript's equals sign in webstorm

Question

all

when i config my Webstorm9 settings like this ,it turns out that the sample code in the right aligns the equals sign properly

but when i formatting my javascript code in the editor it doesn't work,it still shows

and what i want is align the equals sign

anyone who can take a look?

-------EDIT------

maybe i misunderstand the checked option,but i copy the sample code to my editor then reformat it, oh,bad result..

Answer 1

In PHPStorm 2017 (and, I assume, by extension WebStorm) that behavior can be achieved by:

1. going to Settings > Editor > Code Style > JavaScript
2. Wrapping and Braces tab
3. scroll down to Variable declarations and set Align to When Grouped

Additionally, setting Variable declarations to Wrap always will result in this when reformatting:

Update: unchanged in version 2018 and in WebStorm/PHPStorm version 2019, the steps I described above still work the same.

Answer 2

In Webstorm 10,

1. Go to Settings> Editor> Code Style > JavaScript

2. Go to the "Other" tab and check "Align multiple 'var' statements and assignment" and click Ok.

3. Go to Code > Reformat code (Ctrl + Alt + L)

Voila!

Answer 3

Update for WebStorm 2017.3

Apparently, since version 2017.3, the Other tab has been removed from Code Style > JavaScript.

Now you have a couple of alignment options under the Wrapping and Braces tab (scroll down to the bottom):

It took me a while to figure this out, hope this helps

Answer 4

Update for Webstorm 2016.1

@Hudvoy still has the right answer for this. I've updated with a visual of where you need to look in Webstorm 2016.1