更多VSCode插件使用请访问:VSCode常用插件汇总


当大家在公司工作时,不可能永远是一个人维护一个项目,当多个人参与一个项目,每个人使用的编辑器不一样,代码风格自然也不一样,那么如何让使用不同编辑器的开发者能够轻松惬意的遵守最基本的代码规范呢?

最后终于找到了editorConfig这个东东,发现在这里配置的代码规范规则优先级高于编辑器默认的代码格式化规则。如果我没有配置editorconfig,执行的就是编辑器默认的代码格式化规则;如果我已经配置了editorConfig,则按照我设置的规则来,从而忽略浏览器的设置。

EditorConfig包含一个用于定义代码格式的文件和一批编辑器插件,这些插件是让编辑器读取配置文件并以此来格式化代码。

安装

VSCode安装非常简单,直接在插件市场搜索EditorConfig for vs code 安装就行了,安装完毕记得重启编辑器。

使用

  • 在当前项目根目录下添加.editorconfig文件
  • 安装EditorConfig扩展
  • 全局安装或局部安装editorconfig依赖包(npm install -g editorconfig | npm install -D editorconfig)
  • 打开需要格式化的文件并手动格式化代码(Mac OS :shift+option+f  Windows :shift+alt+f)

可以通过资源管理器侧栏的上下文菜单右键选择Generate .editorconfig,然后这个目录下面就会创建出一个.editorconfig文件了,当然如果团队里有已经配置好的这个文件,直接复制过来就行了。

下面说说它的常用配置和使用方法:

一、常用属性配置

1、root<boolean>  :  是否是顶级配置文件,设置为true的时候才会停止搜索.editorconfig文件

2、charset<"latin" | "utf-8" | "utf-8-bom" | "utf-16be" | "utf-16le">     :    文件编码格式

3、indent_style<"tab" | "space">    :  缩进方式

4、indent_size<number>    :    缩进大小

5、end_of_line<"lf" | "cr" | "crlf">    :    换行符类型

6、insert_final_newline<boolean>   :     是否让文件以空行结束

7、trim_trailing_whitespace<boolean>  :   是否删除行尾空格

8、max_line_length<number>    :    最大行宽。

二、常用文件名匹配

1、*                  匹配除/之外的任意字符

2、**                 匹配任意字符串

3、?                 匹配任意单个字符

4、[name]                 匹配name字符

5、[!name]                 不匹配name字符

6、[s1,s2,s3]                 匹配给定的字符串

7、[num1..num2]                 匹配num1到mun2直接的整数

目前VSCode并不是所有属性都支持,所以只需要配置下面几个属性即可:

  • indent_style
  • indent_size
  • tab_width
  • end_of_line (保存时)
  • insert_final_newline (保存时)
  • trim_trailing_whitespace (保存时)

使用建议

这个插件只能简单的配置一些规范,并不能完全满足需求,所以还需要其它代码检查工具配合使用,比如说:ESLint或StyleLint,统一代码风格。

.editorconfig

# EditorConfig helps developers define and maintain consistent
# EditorConfig帮助开发人员定义和维护一致性
# coding styles between different editors and IDEs
# 不同编辑器和ide之间的编码样式
# 打开需要格式化的文件并手动格式化代码(Mac OS :shift+option+f  Windows :shift+alt+f)
# editorconfig.org

# editorconfig顶级配置文件,停止向上寻找配置文件
root = true [*]
# change these settings to your own preference
# 将这些设置更改为您自己的首选项
# 缩进样式=空格
indent_style = space
# 缩进大小=
indent_size = # we recommend you to keep these unchanged
# 我们建议你保持这些不变
# 换行符类型 = lf
end_of_line = lf
# 字符集=utf-
charset = utf-
# 删除行尾空格 = 是
trim_trailing_whitespace = true
# 插入最后一行=真
insert_final_newline = true [*.md]
# 删除行尾空格 = 否
trim_trailing_whitespace = false [package.json]
# 缩进样式=空格
indent_style = space
# 缩进大小=
indent_size =

VSCode常用插件之EditorConfig for vs code 使用的更多相关文章

  1. VSCode常用插件汇总

    vscode常用插件汇总: 点击插件名字,查看使用文档 vscode-fileheader : 添加注释到文件头,并支持自动更新文件修改时间. EditorConfig for vs code :   ...

  2. VSCode常用插件之vscode-stylelint使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 vscode-stylelint这是一个检验CSS/SASS/LESS代码规范的插件. StyleLint 使用指南 vscode-style ...

  3. VSCode常用插件之ESLint使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 ESLint这是VS Code ESLint扩展,将ESLint JavaScript集成到VS Code中. 首先简单说一下使用流程: 1. ...

  4. VsCode 常用插件清单

    插件离线安装说明 在一些内网开发环境中,无法做到在线安装,这个时候就需要对插件进行离线安装 了 打开 VSCode 插件市场网址 Extensions for the Visual Studio fa ...

  5. VSCode常用插件之Simple New File使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 Simple New File这是一个从命令面板简单创建新文件.文件夹.通过侧边栏创建新文件可能会很繁琐.该扩展旨在通过命令面板使创建文件或目 ...

  6. VSCode常用插件之open in browser使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 open in browser安装完这个插件就可以在编辑器菜单右键html,在默认浏览器打开了,高级使用暂未了解,请自行其它文章学习

  7. VSCode常用插件之vscode-fileheader使用

    更多VSCode插件使用请访问:VSCode常用插件汇总 vscode-fileheader这是一个给js文件(html.css也可以使用,但是没意义!!!)生成头部注释的插件,每次修改js文件之后会 ...

  8. 前端开发VScode常用插件

    名称 功能 Auto Close Tag 自动闭合HTML标签 Auto Import Typescript 自动import提示 Auto Rename Tag 修改HTML标签时,自动修改匹配的标 ...

  9. 前端vscode常用插件

    Auto Rename Tag 这是一个html标签的插件,可以让你修改一边标签,另外一边自动改变. Beautify 格式化代码插件 Braket Pair Colorizer 给js文件中的每一个 ...

随机推荐

  1. C语言三(2)

    多重 if...else....else 结构 语法: if(条件1) { 语句1; } else if(条件2) { 语句2; } else if(条件3) { 语句3; } else { 语句N; ...

  2. Ansible学习笔记(一):部署管理Windows机器遇到的一些坑

    在给国盛通上海测试环境做Ansible管理Windows服务器的时候,遇到了一些坑,Google解决掉了,特此记录,坑用红色标记. 一.环境说明 1.Ansible管理主机 操作系统:CentOS 7 ...

  3. 1、SSH无密码访问

    1.在需要无密码登录远程服务器的机器上(如A→B服务器)生成密码对 A:服务器操作: ssh-keygen -t rsa :输出的内容直接一路回车即可(enter) 执行上面一步,会在~/.ssh目录 ...

  4. 类加载机制与JVM调优命令

    一.类加载过程 类加载:类加载器将.class字节码文件加载进Java虚拟机的内存中. 加载:在硬盘上查找并通过IO读入字节码文件 连接:执行校验.准备.解析(可选)步骤 校验:校验字节码文件的正确性 ...

  5. leetcode面试题 02.06. 回文链表,解题心路

    目录 leetcode面试题 02.06. 回文链表,解题心路 1.题目描述 2.java语言题解一 3.java语言题解二 4.C语言题解一 leetcode面试题 02.06. 回文链表,解题心路 ...

  6. 如何修改Tomcat运行时jvm编码

    问题: 最近在部署项目的时候出现数据乱码的情况,经过一番查看项目都是用的UTF-8编码格式,数据也是,但是经过调用接口传给对方就乱码了. 由于是部署在Windows环境下,Windows默认编码GBK ...

  7. 安装Nexus到Linux(源码)

    运行环境 系统版本:CentOS Linux release 7.4.1708 (Core) 软件版本:Sonatype-Nexus-3.14.0 硬件要求:无 安装过程 1. 调整系统参数 需要调整 ...

  8. Excel——排序筛选

    1,自定义排序:多个关键字,从右向左一一排序 * 按颜色排序 * 按自定义序列排序 *两列中,列一个中间数,升序 * 打印标题行 * 选中,定位条件(可见),选择 * 数值筛选(大于等于),文本筛选( ...

  9. jQuery---钢琴案例 (按下1-9数字键,能触发对应的mouseenter事件)

    钢琴案例 (按下1-9数字键,能触发对应的mouseenter事件) 1. 结合之前的学习,主要内容,就是on注册keyup事件,函数里传入e, 用e.keyCode,来获取1-9的数字的范围. 如果 ...

  10. cisco 路由器的操作系统基础命令集

    路由器和交换机里都有操作系统,cisco的操作系统叫ios. 怪不得路由器贵,原来也是带操作系统的机器啊,以前真是小白. ios里的几种模式 1,>:用户模式:啥也干不了. 2,#:特权模式:用 ...