vscode vue,html,css 格式化代码的时候 每个属性都进行换行了,但是不想每个属性都换行应该怎么设置 电脑版发表于:2024/9/18 16:52 每个属性都自动换行了,这个是vscode代码格式化设置的问题。解决方法如下。 #### 一:按下Ctrl + ,(或者Cmd + ,在Mac上)打开设置。找到当前使用的格式化插件 搜索:`vetur.format.defaultFormatter.html`表示html使用的格式化插件 <img src="https://img.tnblog.net/arcimg/aojiancc2/7069f930677f4a7c8b0bc52f548d2ed4.png" style="width:600px;height:auto;"> 可以看到我目前使用的vue html格式化插件是`Prettier`,当然如果你装了更多vue html的格式化插件这里可以选择。比如我这里还有几个可以选择的。 <img src="https://img.tnblog.net/arcimg/aojiancc2/ae8f5c7fb90d42fcb639a4c8e66111fe.png" style="width:600px;height:auto;"> **你也可以进行`vetur.format.defaultFormatter.css`搜索,这个是设置样式的** <img src="https://img.tnblog.net/arcimg/aojiancc2/0d7861e6b6c9445a89e083d8e9fc6eb8.png" style="width:600px;height:auto;"> **还可以直接搜索`vetur.format.defaultFormatter`** 这个会把vue相关的格式化配置都列出来,包括html,css,js,LESS等。 ### 二:设置一下换行的宽度即可 我这里使用的格式化插件是`Prettier`,所以搜索`Prettier: Print Width`,调整printWidth的值即可,这个值决定了在多少个字符后进行换行。你可以增加这个值,使得更多的属性能够在同一行显示。 <img src="https://img.tnblog.net/arcimg/aojiancc2/c28f6b4f0cab48a5b9ce43aa8c4f01d1.png" style="width:600px;height:auto;"> 默认是80/100,我直接把两个都修改为1000就不会在格式化的时候换行了。