vscode设置vue属性多了格式化不换行

最新推荐文章于 2024-05-23 10:47:32 发布

PYPMY

最新推荐文章于 2024-05-23 10:47:32 发布

阅读量373

点赞数 4

文章标签： json

本文链接：https://blog.csdn.net/PYPMY/article/details/119423003

版权

在VSCode中，遇到Vue文件属性格式化换行的问题，可以通过调整设置来优化。具体步骤包括：进入设置，搜索`vetur.format.defaultFormatter.html`，选择`js-beautify-html`插件，并在`setting.json`中添加相关配置，如`wrap_attributes`设为`auto`，以保持属性在同一行。这样可以改善代码的阅读体验。

摘要由CSDN通过智能技术生成

问题描述：

vue有很多属性的时候，vscode格式化会自动换行，每个属性占一行，看起来很难受

解决方法：

首先打开vscode的》文件》首选项》设置

搜索vetur.format.defaultFormatter.html ，下面有个下拉框，选择js-beautify-html (PS:需要你先安装这个插件)

点击左侧三个点选择打开setting.json，加入如下代码，然后保存

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