VS Code 格式化 Vetur 配置

在编辑代码时，我们想要格式化一下代码，看起来更清晰规整。
但格式化后，tab 空格有 4 个变成了 2 个，并且 属性也都折行了。

这并不是我们想要的，如何配置呢？

找到 文件 ==》首选项 ==》 设置 ==》扩展，如下图：

image.png

在扩展里找到：Vetur

image.png

这里 Tab Size 默认为 2 改为 4 就可了。
这时在格式化时， tab 空格就是 4 了，但属性还是折行的，还需要我们在 setting.json 中 配置

"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.format.defaultFormatter.js": "vscode-typ=script",
"vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "auto"
    },
    "prettyhtml": {
      "printWidth": 100,
      "singleQuote": false,
      "wrapAttributes": false,
      "sortAttributes": false
    }
}

好了，到这里格式化时，tab 空格是 4 了，属性也不会折行了，赶紧试试吧 ~~~