1辕录、插件安裝
這里需要使用到兩個(gè)插件Eslint
和Vetur
2衣盾、設(shè)置
打開菜單文件
→首選項(xiàng)
→設(shè)置
→首選項(xiàng)
秒紧,點(diǎn)擊右上角打開設(shè)置按鈕切換到setting.json
打開設(shè)置
修改配置如下:
{
"editor.suggestSelection": "first",
// vscode默認(rèn)啟用了根據(jù)文件類型自動(dòng)設(shè)置tabsize的選項(xiàng)
"editor.detectIndentation": false,
// 重新設(shè)定tabsize
"editor.tabSize": 2,
// #每次保存的時(shí)候自動(dòng)格式化
"editor.formatOnSave": true,
// #每次保存的時(shí)候?qū)⒋a按eslint格式進(jìn)行修復(fù)
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "vue",
"autoFix": true
},
{
"language": "html",
"autoFix": true
}
],
// #讓函數(shù)(名)和后面的括號(hào)之間加個(gè)空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": false,
// #這個(gè)按用戶自身習(xí)慣選擇
"vetur.format.defaultFormatter.html": "js-beautify-html",
// #讓vue中的js按編輯器自帶的ts格式進(jìn)行格式化
"vetur.format.defaultFormatter.js": "vscode-typescript",
"vetur.format.defaultFormatterOptions": {
"prettier": {
// 使用單引號(hào)
"semi": false
},
"js-beautify-html": {
// html不換行
"wrap_line_length": 250,
"wrap_attributes": "auto",
"end_with_newline": false
}
},
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
}