调整VScode中Vue的自动格式化设置

VScode的Vue格式化插件Vetur的使用过程中，格式化出来的代码并不美观，可以进行如下设置：

打开VScode的 >文件 > 首选项 >设置>拓展>Vetur
找到如下图所示的区域

将setting.json文件替换为如下代码

{
    "[html]": {
        "editor.defaultFormatter": "lonefy.vscode-JS-CSS-HTML-formatter"
    },
    "[javascript]": {
        "editor.defaultFormatter": "lonefy.vscode-JS-CSS-HTML-formatter"
    },
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_line_length": 200,
            "wrap_attributes": "auto",
            "end_with_newline": false
        }
    },
    "vetur.format.options.tabSize": 4,
    "vetur.grammar.customBlocks": {
        "docs": "md",
        "i18n": "json"
    }
}

保存即可设置完成。

回到需要格式化的vue文件中，按shift+alt+f进行格式化。