VS Code编写HTML-CSS-JS等——代码格式化

本文指导如何在VSCode中安装并配置Prettier插件,实现保存时自动代码格式化,并探讨如何调整默认设置以符合个人喜好。讨论了JS-CSS-HTMLFormatter的替代性,并邀请读者分享其他高效格式化方案。

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

VS Code编写HTML-CSS-JS等——代码格式化


功能:保存时自动将代码进行格式标准化

步骤

  1. VS Code扩展中搜索:Prettier - Code formatter
    查找插件
  2. 点击安装安装
  3. 进入设置,输入“save”进行查找,打上“勾”后,点击“在settings.json中编辑”
    进入设置打勾并进入settings.json
  4. 编辑settings.json,在现有大括号内添加下面的代码,注意true后面要有英文逗号
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }

举例

  1. 前面代码修改依据
    修改依据
  2. 效果展示(第一张为保存前的,第二张为保存后的)
    保存前保存后

总结

  1. 类似格式化的插件还有JS-CSS-HTML Formatter(只有两颗星),应该星多更好用些吧哈哈哈~~
  2. 修改设置是起到保存的时候触发格式化的操作。
  3. 我还不怎么了解这个插件,因为它在格式化之后,默认将平时的回车效果变为空两格,我希望的是回车空四格(平时的Tab键效果)。此文章纯属抛砖引玉,希望大家有更好的方法在评论区一起交流哦!谢谢大家!!!
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值