配置

VS Code 文件 -> 首选项 -> 设置 -> 用户设置栏 -> 扩展 -> Vetur

打开文件加入如下配置：

{
    // tab 大小为2个空格
    "editor.tabSize": 2,
    // 字體大小
    "editor.fontSize": 16,
    // 設置行高
    "editor.lineHeight": 25,
    // 保存时格式化
    "editor.formatOnSave": true,
    // 开启 vscode 文件路径导航
    "breadcrumbs.enabled": true,
    // 显示 markdown 中英文切换时产生的特殊字符 
    "editor.renderControlCharacters": true,
    // 设置 eslint 保存时自动修复
    "eslint.autoFixOnSave": true,
    // 添加 vue 支持
    "eslint.validate": [
        "javascriptreact",
        "vue",
        "javascript",
        {
            "language": "vue",
            "autoFix": true
        },
        "html",
        {
            "language": "html",
            "autoFix": true
        }
    ],
    // #让函数(名)和后面的括号之间加个空格
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    // #选择 vue 文件中 template 的格式化工具
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // #让vue中的js按编辑器自带的ts格式进行格式化
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    // vetur 的自定义设置
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "singleQuote": false,
            "semi": true
        }
    },
    //颜色配置
    "editor.tokenColorCustomizations": {
        "comments": "#858c99", // 注释
        "keywords": "#c678dd", // 关键字
        "variables": "#9fb2bf", // 变量名
        "strings": "#98c379", // 字符串
        "functions": "#e06c75", // 函数名
        "numbers": "#d19a66", // 数字
    },
    // 选中高亮的颜色
    "workbench.colorCustomizations": {
        "editor.selectionBackground": "#4e8bda7e", //选中高亮
        "editor.background": "#282c35", //背景色
        "editorCursor.foreground": "#bebebe", //编辑器光标颜色
        "editor.lineHighlightBackground": "#14524e", //光标所在行高亮内容的背景颜色
        "editor.lineHighlightBorder": "#00000000", //光标所在行四周边框的背景颜色
        "sideBar.background": "#21252b",
        "sideBar.foreground": "#b3bccc",
        "tab.inactiveBackground": "#21252b",
    },
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "gitlens.advanced.messages": {
        "suppressGitVersionWarning": true
    },
    "files.autoSave": "onFocusChange",
}

完成

在Vue文件中 ctrl+s 保存一下，你会惊奇的发现。