在使用vscode開發vue專案時，嚴格檢查讓人有點煩惱，必然需要一款可以自動格式化的外掛進行快速嚴格檢查的格式化。vscode外掛會推薦使用 vetur 外掛才會進行vue檔案的識別與高亮。

安裝完 vetur 後確實是可以對 vue檔案進行高亮顯示了，但是當你按下 shift+alt+f 進行格式化時，發現本來沒有錯誤的程式碼卻變成了一堆錯誤，莫名加上了分號，單引號也成功變成雙引號了。在vue的嚴格檢查中這些是最煩的。

那麼需要對vscode的配置檔案進行配置才可支援vue正確格式化。

開啟 檔案 -》首選項 -》往下拉找到 settings.json -》開啟

預設的 settings.json 配置項可能不一樣，現在只需要往json中寫入以下配置就可格式化vue啦。

"vetur.format.defaultFormatterOptions": {
 "prettier": {
  "semi": false,"singleQuote": true
 }
}

可能會出現 分號和雙引號確實不會再自動添加了，但是不會在方法括號之間插入空格，可以再加入這條配置即可。

"javascript.format.insertSpaceBeforeFunctionParenthesis": true,

"vetur.format.defaultFormatter.js": "vscode-typescript"

最好再配置下vscode支援vue語言

"eslint.validate": [
 "javascript","javascriptreact","html",{
   "language": "vue","autoFix": true
  }
]

補充知識：vscode格式化Vue出現的問題：單引號變雙引號

問題描述

在使用vscode格式化vue程式碼時，出現單引號變成了雙引號問題

解決方案

在專案根目錄下新建檔案：.prettierrc.json

內容：

{
  "singleQuote":true,"semi":false
}

以上這篇解決vscode進行vue格式化,會自動補分號和雙引號的問題就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支援我們。