VSCode - Beautify插件配置

注: 本文摘自 黑火巨雷 - 簡書

1. 在工作目錄下建立.jsbeautifyrc文件

官方文檔

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

注釋

• brace_style，格式風格，詳見官方說明（為避免和eslint默認檢查沖突，建議此屬性設置為 none,preserve-inline）
• indent_size，縮進長度（為避免和eslint默認檢查沖突，建議此屬性設置為 2）
• indent_char，縮進填充的內容（充滿♂）
• jslint_happy:true，若你要搭配jslint使用，請開啟此選項
• unformatted:["a","pre"]，這里放不需要格式化的標簽類型。注意 template 也是默認不格式化的，.vue 的template 標簽如果需要格式化請在 .jsbeautifyrc 重新定義不帶 template 的聲明屬性

2. 啟用保存時自動

在VSCode的配置文件里添加 editor.formatOnSave:true 即可實現保存時自動格式化

3. 快捷鍵

在 VS Code 的鍵盤快捷方式文件里添加

{
  "key": "cmd+b", // 自己定鍵位
  "command": "HookyQR.beautify",
  "when": "editorFocus"
}