Vscode格式化代码后代码不自动换行

最新推荐文章于 2024-08-26 21:09:05 发布

smile@qingqing

最新推荐文章于 2024-08-26 21:09:05 发布

阅读量1.5w

点赞数 13

CC 4.0 BY-SA版权

分类专栏：前端之路文章标签： vscode 格式化代码不换行

本文链接：https://blog.youkuaiyun.com/weixin_43363871/article/details/113586876

前端之路专栏收录该内容

46 篇文章

订阅专栏

本文介绍如何在VSCode中通过调整settings.json文件来优化代码格式化设置，以实现更符合个人需求的代码展示方式。具体包括增大每行属性数量、调整属性排列方式等。

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

在做项目的时候原本可以在一行可以清晰展示的代码，格式化后就多行展示，有点烦人，可以尝试加入以下代码试试：

Vscode中找到设置(有2种方法)
- vscode–>首选项–>设置，之后在出现的界面输入settings.json。
- 也可以在vscode界面左下角点击设置的图标之后点击设置同样也可以找到。

在settings.json中加入以下代码

"vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
         "wrap_line_length": 900, // 数值越大，一行放的属性越多
         "wrap_attributes": "auto",
         "end_with_newline": false
     },
     "prettyhtml": {
         "printWidth": 100,
         "singleQuote": false,
         "wrapAttributes": false,
         "sortAttributes": false
     }
 },
 "vetur.format.defaultFormatter.html": "js-beautify-html",
 "vetur.format.defaultFormatter.js": "vscode-typescript",