VSCode高效开发插件

文件图标 vscode-icons

首先为了我们在编码时有一个高效、易用的界面,我们需要对一些不明了的组件做一些美化。

vscode-icons 插件可以实现对各种文件类型的文件前的图标进行优化显示,这样我们在查看长长的文件列表的时候,可以直接通过文件的图标就可以快速知道文件的类型,而不是去看文件的后缀。

代码美化 Beautify

Beautify 插件可以快速格式化你的代码格式,让你在编写代码时杂乱的代码结构瞬间变得非常规整,代码强迫症必备,较好的代码格式在后期维护以及他人阅读时都会有很多的便利。

插件支持的语言非常多,基本堵盖了目前所有的语言,而且你还可以自定义代码格式化的结构。

对齐插件Better Align

在开发过程中,如果代码很整齐的话,那么这个代码就会看起来比较舒服。就像看到一个整洁的屋子一样。
其中,=,:等对齐,则是一个重要的整洁处理。
这个就是vscode的对齐插件,启动vscode,进入插件管理,没有安装的话,搜索一下,很快就有了。然后安装即可。vscode的插件管理真是做的很不错,易用。

代码检查工具 ESLint

ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。

而 VSCode 中的 ESLint 插件就直接将 ESLint 的功能集成好,安装后即可使用,对于代码格式与规范的细节还可以自定义,并且一个团队可以共享同一个配置文件,这样一个团队所有人写出的代码就可以使用同一个代码规范,在代码签入前每个人可以完成自己的代码规范检查。

快速注释 Document This

优秀的代码除了优秀的性能、规范的格式,注释也是不可或缺的,而且注释也应该有一套标准的注释方法,特别对于 JavaScript 这种语言。

Document This 可以快速地帮你生成注释,如一些函数的注释还能帮你抽取出参数的定义等,是你编写规范代码必备的工具。

代码拼写检查 Code Spell Checker

此插件安装后就不用管就好了,在你代码中有单词拼写错误时,你就会发现它的好处,因为我们写代码毕竟都是大量的英文单词变量定义,插件还可以给出错误拼写单词的建议。

换行符,设置等

{
    "editor.tabSize": 2,

    "files.eol": "\n", // uninx换行符
    
    "trailing-spaces.trimOnSave": true, // 保存时自动删除行尾部空白字符
    "files.insertFinalNewline": true, // 保存时自动在文件末尾插入空行
    
    "editor.fontSize": 16,
    "alignment.operatorPadding": "left",
    
    // 自定义shell
    "terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",  // git安装目录
    "extensions.ignoreRecommendations": false,
    "window.zoomLevel": 1,
    "[javascript]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问题 代码没有提示: 许多刚接触RN开发的非前端同学,都会问“哪个编辑器有智能提示?”。。。而对于前端同学来说,现...
    宋00阅读 2,616评论 1 6
  • VSCode 插件 通用 编辑器相关 Chinese (Simplified) Language Pack for...
    幽行者阅读 2,404评论 0 2
  • 我:我感觉除了家人,就你对我最好了 宝贝:我不就是你的家人嘛
    托尔西奇阅读 160评论 0 0
  • 2019年2月15日红源悟语 自我觉醒:想,都是问题;做,才是答案! 今日成长 经得起今天的沮丧,才能蜕变成明天的...
    红源随笔阅读 90评论 0 0
  • 湖南算得上是四季分明的,虽然春日里也有艳阳,秋日里妖风也来得频繁,但丝毫不影响每个季节该有的气质。 说起来,湖南很...
    开始写吧王皮皮阅读 257评论 0 0