解决Vscode中代码格式化时老换行

问题：

小颖用vscode的格式化代码后发现代码老是换行，有时看起来就很难受，比如下面的：

问度娘后终于弄好啦，记录下，省的以后换电脑了重装了vscode又不会了，主要是百度给的解决方法好几个，但有的改了就没用················烦人··········

如何解决：

打开Vscode,点击文件 —》首选项 —》设置—》搜索vetur —》 在setting.json中编辑—》输入以下代码（注意是json形式的，如果setting.json中为空，要自己在最外层加一个{}）

    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_line_length": 160,
            "wrap_attributes": "auto",
            "end_with_newline": false
        },
        "prettyhtml": {
            "printWidth": 100,
            "singleQuote": false,
            "wrapAttributes": false,
            "sortAttributes": false
        }
    },

效果：