vscode beautify插件格式化清單大括号[{換行的brace_style字段建議配置

很多人都在用的是：

{
   "brace_style": "none,preserve-inline",
   "indent_size": 2,
   "indent_char": " ",
   "jslint_happy": true,
   "unformatted": [""],
   "css": {
     "indent_size": 2
   }
 }
           

會影響到清單和大括号換行的設定最關鍵的就是

brace_style

。

這裡 none 的意思是針對清單和大括号不做處理，保持原樣，也就是當：

[
	{
		"x": "x"
	},
	{
		"x": "x"
	}
]
或
[{
	"x": "x"
},
{
	"x": "x"
}]
           

均不會處理清單和大括号

[{

之間的換行。

如果設定為 expand ，會自動做換行處理，也就是均變為如下格式：

[
	{
		"x": "x"
	},
	{
		"x": "x"
	}
]
           

可見預設會換行的體驗感是比設定為 none 要好的。

使用 preserve-inline 是為了避免多行的情況，比如：

import { a, b } from c
           

會格式化成：

import {
  a,
  b
} from c
           

使用了 preserve-inline 就不會發生這種情況。

也就是說建議設定為：

另外，可以直接在 settings.json 裡配置全局，沒有必要每個檔案夾都建立

.jsbeautifyrc

檔案：

"beautify.config": {
	"brace_style": "expand,preserve-inline",
	"indent_size": 2,
	"indent_char": " ",
	"jslint_happy": true,
	"unformatted": [""],
	"css": {
	  "indent_size": 2
	}
}  
           

附：官方配置說明