VSCode break comma separated values into rows

Question

Is there a way to separate this format:

const { a, b, c, d, e, g, f, g, etc } = alphabet

Into

const { 
  a, 
  b, 
  c, 
  d, 
  e, 
  g, 
  f, 
  g, 
  etc } = alphabet

Easily?

UPDATE

After endless search for a few days, I decided to spend my weekend creating an extension to achieve this. See my answer below.

Answer 1

You can use the multi cursor feature in this case.

• Move the list to the position where you would like to see the first element
• Select the first comma
• Execute editor.action.addSelectionToNextFindMatch (on Windows it's set to CTRL+d by default) until all commas are selected
• Now you have multiple selections with multiple cursors at every comma. Press the right arrow key to set the cursors behind the commas
• Press ENTER
• Adjust the indentation if you want.

This is how it looks like:

Answer 2

Update

I've done this a couple of years ago. Nowadays, I'm using prettier which has been really helpful and more productive. However, I'm keeping a copy of the plugin I made for ad-hoc purposes and for education.

---

I've been looking for support on this for days but can't find any. So I decided to create an extension called Break From Comma!

I hope this helps! Contributions are very much welcome too!

Features

• Supports both single and double quotations
• Automatic indentations!

Limitation

• It doesn't support multi cursor at the moment.