VScode格式化时设置html不换行

最新推荐文章于 2024-03-22 10:39:04 发布

Candid213

最新推荐文章于 2024-03-22 10:39:04 发布

阅读量2.8k

点赞数

CC 4.0 BY-SA版权

文章标签： html5 html visual studio code

本文链接：https://blog.csdn.net/qq_38768545/article/details/116564262

在VScode中，通过设置配置文件setting.json，可以实现.html文件格式化时不换行。避免使用prettier格式化时HTML标签前自动添加Tab的问题。只需在设置中添加特定代码，即可消除head、body、/html标签前的额外行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

VScode格式化时设置.html文件不换行

前提：Ctrl+Shift+P 输入settings 打开setting.json文件

采用VSCode原生的格式化 HTML文件

"editor.defaultFormatter": "vscode.html-language-features"

注意：如果用 prettier格式化时，会导致二级三级标签前面自动补一个Tab键（比如head标签前会自动tab），这个格式实在不符合我的审美。。。
（PS： prettier从入门到卸载hhhhhh，目前prettier就主要用于JS文件格式化了,如果有大佬知道怎么去掉 prettier格式化html时会在标签前补Tab这个点欢迎补充）

还是在settings.json文件中，补下图中代码

    "html.format.extraLiners": "", //这个玩意害人，VSCode自带的格式化html时会自动把head, body, /html标签前加空行
    "html.format.enable": false, //使style标签中的css代码不换行

在这里插入图片描述
（这是原理：可以发现，其实不是换行导致而是VSCode默认在head body /html三个标签前额外补行，实话说我不太懂它的审美…就去掉了）

3.测试
Alt+Sift+F 格式化快捷键愉快测试

4.写的不好的话勿喷谢谢！文章系本人捣鼓3小时左右成果，转载请附上原链接。