更多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. REDTEAM 指南---第四章 外部侦察

    第四章 外部侦察 贡献者:Haythem Arfaoui 翻译BugMan 主动侦察 介绍 主动足迹涉及使用可以帮助您收集更多信息的工具和技术 有关目标的信息.与被动足迹不同的是,过程永远不会“触及” ...

  2. JS推箱子游戏

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Inse ...

  3. 寒假学习进度一(安卓配置环境的搭建和hello world)

    今天学习内容:观看了哔哩哔哩上的安卓教学视频,简单了解下了安卓的基本知识 具体内容: 一.配置安卓开发环境(安装Android studio,配置JDK) Android studio是个集成环境,不 ...

  4. 「Flink」使用Java lambda表达式实现Flink WordCount

    本篇我们将使用Java语言来实现Flink的单词统计. 代码开发 环境准备 导入Flink 1.9 pom依赖 <dependencies> <dependency> < ...

  5. PMP--3. 项目启动过程组

    ####################################################### 从第三章开始,我正式进入项目过程,启动.规划.执行.监控.收尾五大过程组的具体在之后依次 ...

  6. 关于hp proliant sl210t服务器raid 1阵列配置(HP P420/Smart Array P420阵列卡配置)

    hp proliant sl210t服务器,一般都会带有两个阵列卡 一个服务器自带的Dynamic Smart Array B120i RAID控制器,一个为Slot卡槽上的Smart Array P ...

  7. cf959E

    题意简述:一个包含n个点的完全图,点的编号从0开始,两个点之间的权值等于两个点编号的异或值,求这个图的最小生成树 规律是 ∑ i from 0 to n-1 (i&-i) #include & ...

  8. Python 实现选择排序

    选择排序算法步骤: 找到数组中最小的那个元素中, 将它和数组的第一个元素交换位置, 在剩下的元素中找到最小的元素,将它和数组的第二个元素交换位置, 如此往复,知道将整个数组排序. 逐步分析: 假设一个 ...

  9. Django如何连接mysql

    1.设置django的mysql驱动为pymysql 因为django默认的是使用MySqlDb连接mysql数据库,但是由于该模块不支持python3.4以上版本,所以使用pymysql模块 在项目 ...

  10. Java中Thread方法启动线程

    public class ThreadTest extends Thread {  private int count = 10; @Override public void run() { //重写 ...