先把解决方案直接在vsCode的settings.json中添加{//缩进大小,根据需要配置"vetur.format.options.tabSize":4,"vetur.format.defaultFormatter.html":"js-beautify-html","vetur.format.defaultFormatterOptions":{"js-beautify-html":{//"wrap_attributes":"force-expand-multiline","wrap_line_length":120,"wrap_attributes":"auto","end_with_newline":false,//"indent_head_inner_html":true,//移除列"void_elements":["area","base","br","embed","hr","img","input","keygen","link","menuitem","meta","param","source","track","wbr","!doctype","?xml","?php","?=","basefont","isindex"],},"prettyhtml":{"printWidth":100,"singleQuote":false,"wrapAttributes":false,"sortAttributes":false}},}主要有效的属性有void_elements是识别所有没有子标签的标签。在默认状态下,标签col被删除并重新排版以解决其他问题。一是这个配置只在vscode中生效,二是只对vetur插入有效void_elements属性应该对所有使用VSCodeBeautify排版工具的插件生效,但是根据插件的不同配置方式会略有不同。配置中除void_elements之外的属性还有其他作用,不一定与void_elements一起使用。按需配置为什么col不会缩进,因为html本身就有col标签,是一个单标签,没有子元素如何打开settings.json按F1进入settings.json,区分工作区配置和全局配置.可以配置文档链接https://github.com/HookyQR/VS...其他其他配置可以vue文件按照四个空格缩进,默认是两个,如果不喜欢4个空格缩进,修改vetur。格式。options.tabSize即可
