VScode vue后缀文件 设置 html 属性不换行

前言

vue文件格式化 需要安装插件 Vetur 可自行百度

默认格式化的

属性自动换行，导致一个文件千百行 ，看着不舒服，最关键的是标签无法折叠了，这是最不能忍的

image.png

打开设置

image.png

搜索vetur.format

image.png

编辑 setting.json文件

image.png

{
    "window.zoomLevel": 1,
    "files.associations": {
        "*.wpy": "vue",
        "*.cjson": "jsonc",
        "*.wxss": "css",
        "*.wxs": "javascript"
    },
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "emmet.includeLanguages": {
        "wxml": "html"
    },
    "minapp-vscode.disableAutoConfig": true,
    "explorer.confirmDelete": false,
    "vetur.format.options.tabSize": 4,
    "vetur.format.defaultFormatterOptions":{
        "js-beautify-html":{
            "wrap_attributes":"auto"
        }
    }
}

效果展示

清爽多了

image.png