在VS Code里面編輯Vue代碼，通常我們會安裝插件Vetur，本次介紹的格式化代碼也依賴于Vetur插件。具體見一下步驟
注： VS Code版本為1.74.3
1. 安裝插件Vetur
2. 配置自動格式化，具體路徑【文件】-【首選項】-【設(shè)置】，打開設(shè)置（json）
3. 將以下內(nèi)容復(fù)制到settings.json文章來源：http://www.zghlxwxcb.cn/news/detail-611386.html
{
// vscode默認(rèn)啟用了根據(jù)文件類型自動設(shè)置tabsize的選項
"editor.detectIndentation": false,
// 重新設(shè)定tabsize
"editor.tabSize": 4,
"editor.fontSize": 16,
// #每次保存的時候自動格式化
"editor.formatOnSave": true,
"editor.formatOnType": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
// 一個tab 代表4個空格寬度
"vetur.format.options.tabSize": 4,
// 編輯器默認(rèn)格式化工具 很重要
"editor.defaultFormatter": "octref.vetur",
// 配置格式化工具的選項 根據(jù)需要自己配置
"vetur.format.defaultFormatterOptions": {
"prettier": {
// Prettier option here https://prettier.io/docs/en/options.html
// 字符串單引號
"singleQuote": true,
// 去掉行末尾分號要
"semi": false,
// 箭頭函數(shù) 參數(shù)需要()包起來
"arrowParens": "always",
// 是否用tab false的話用空格代替tab
"useTabs": false,
// 去掉對象末尾的逗號
"trailingComma": "none"
}
}
}完成以上配置，即可實(shí)現(xiàn)VS Code編輯代碼后自動格式化代碼文章來源地址http://www.zghlxwxcb.cn/news/detail-611386.html
到了這里，關(guān)于VS Code保存后自動格式化Vue代碼---Vetur的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
