VSCode: single-line JS object to multi-line one

Question

That's quite often for me that I need to change my single-line JS object to a multi-line one. Such as:

var obj = { prop1: 'abc', prop2: 123, prop3: 'something else' }

 |          |
 v          v

var obj = {
  prop1: 'abc',
  prop2: 123,
  prop3: 'something else'
}

Is there some shortcut for doing such a thing in VSCode? Or is there some way to create such a shortcut?

Answer 1

You could use splitline plugin. See plugin here: https://marketplace.visualstudio.com/items?itemName=chenzhe.split-line

Answer 2

Prettier - Code formatter

Will solve your needs (easily in visual studio code)

esbenp.prettier-vscode

https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

You can make it format on save, which is very nice.

Answer 3

正确的方法是设置 ESLint（或更漂亮的）规则，VSCode 会在保存时自动为您执行此操作。