vscode 一键规范代码格式

vscode 一键规范代码格式使用 vscode 的过程中自己或者 push 代码以后代码的格式可能会出现错乱 作为一个成熟的开发 当然应该遵守一些代码规范 首先代码整洁度应该排在第一位使用 vscode 格式化代码在少量的情况下可能可以手动去修改格式 但在大量格式排版不对齐的情况下 应该怎么做 文件 gt 首选项 gt 设置 gt 在右侧用户设置中可以对当前编辑器默认的进行更改下面的

文件 -> 首选项 -> 设置 -> {}

在这里插入图片描述
在右侧用户设置中可以对当前编辑器默认的进行更改

下面的复制到用户设置中, ctrl + s 即可完成对代码的规范

{
    // vscode默认启用了根据文件类型自动设置tabsize的选项
   "editor.detectIndentation": false,
   // 重新设定tabsize
   "editor.tabSize": 2,
   // #每次保存的时候自动格式化 
   "editor.formatOnSave": true,
   // #每次保存的时候将代码按eslint格式进行修复
   "eslint.autoFixOnSave": true,
   // 添加 vue 支持
   "eslint.validate": [
       "javascript",
       "javascriptreact",
       {
           "language": "vue",
           "autoFix": true
       }
   ],
   //  #让prettier使用eslint的代码格式进行校验 
   "prettier.eslintIntegration": true,
   //  #去掉代码结尾的分号 
   "prettier.semi": false,
   //  #使用带引号替代双引号 
   "prettier.singleQuote": true,
   //  #让函数(名)和后面的括号之间加个空格
   "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
   // #这个按用户自身习惯选择 
   "vetur.format.defaultFormatter.html": "js-beautify-html",
   // #让vue中的js按编辑器自带的ts格式进行格式化 
   "vetur.format.defaultFormatter.js": "vscode-typescript",
   "vetur.format.defaultFormatterOptions": {
       "js-beautify-html": {
           "wrap_attributes": "force-aligned"
           // #vue组件中html代码格式化样式
       }
   },
   // 格式化stylus, 需安装Manta's Stylus Supremacy插件
   "stylusSupremacy.insertColons": false, // 是否插入冒号
   "stylusSupremacy.insertSemicolons": false, // 是否插入分好
   "stylusSupremacy.insertBraces": false, // 是否插入大括号
   "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
   "stylusSupremacy.insertNewLineAroundBlocks": false // 两个选择器中是否换行
}

修改!!!!!!!!!!

两年后的某一天发现 不知道是不是上面的配置不好使了, 还是vscode更新了, 我配置背景图片以后, 某一天突然发现我的代码格式化不生效了???

你可以忽略我上面步骤先从下面开始

在这里插入图片描述

 // #每次保存的时候自动格式化 "editor.formatOnSave": true, // #每次保存的时候将代码按eslint格式进行修复 "eslint.autoFixOnSave": true, 

另外留言中的说设置setting.json文件以后, 文字变小了, 就重新在设置中设置一下 或者在json文件中添加 “editor.fontSize”: 14, 这个 字体大小就是14px了, 编辑器 默认的话 是12px.

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/217558.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月18日 上午9:18
下一篇 2026年3月18日 上午9:18


相关推荐

  • DOS的net命令详解

    DOS的net命令详解Net命令介绍Net命令是Windows操作系统中一个最重要的命令,它可以管理网络环境、服务、用户、登录等本地信息。前几个操作系统版本的Net命令会有些不同,但是后期操作系统中的Net命令的基本功能都相同。Net命令一般在DOS提示符下运行,即win+r,输入‘cmd’打开。所有的net命令均接受选项“yes”和“no”,也可缩写为“/y”和“/n”Net命令的使用帮助如图,直接输入“net/?”或者“net”即可返回net命令的具体语法。使用“nethelp命令名”还.

    2022年5月28日
    49
  • Jupyter 进阶教程

    Jupyter 进阶教程

    2026年3月12日
    2
  • spring中使用form标签「建议收藏」

    在jsp头部包含:按如下方式编写表单:              111                    222                    333                    444

    2022年4月11日
    51
  • Docker安装配置教程[通俗易懂]

    Docker安装配置教程[通俗易懂]之前docker很久就写了笔记了。后面因为家里有事,耽搁了一年。现在把这部分笔记重新上传一下。大家看看。Docker要求:lunix内核,要求3.8以上centos7Docker是一个进程,一启动就两个进程,一个服务,一个守护进程。占用资源就非常少,启动速度非常快,1s。一台机器上vm,3到10个实例。docker100到10000。1.核心概念:1)镜像images,事先做好一…

    2022年10月10日
    6
  • 软件工程之可行性研究报告

    软件工程之可行性研究报告随着网络技术的快速发展 网络化学习已经是大势所趋 学校机房成了学校上网学习的主要信息场所 学生上机自主化学习是一个不可缺少的环节 但随之而来的却是一系列的机房管理问题 如考勤 收费等问题 而机房收费系统就是为了满足收费管理这一要求而设计的 不仅仅可以降级机房的运营成本提高效率 而且方便准确快捷 为我们的教育管理带来了便利 对于所选择的方案 说明能够带来的收益 这里所说的收益 表现为开支费用的减少或避免 差错的减少 灵活性的增加 动作速度的提高和管理计划方面的改进等 包括

    2026年3月20日
    2
  • 国内如何订阅升级X(推特)的Premium的支付绑卡教程

    国内如何订阅升级X(推特)的Premium的支付绑卡教程

    2026年3月15日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号