VS code常用插件推荐(总结整理篇)

电商程序员

共 1970字,需浏览 4分钟

 ·

2021-06-11 18:58


简介
vscode是微软开发的的一款代码编辑器,就如官网上说的一样,vscode重新定义(redefined)了代码编辑器。当前市面上常用的轻型代码编辑器主要是:sublime,notepad++,editplus,atom这几种。比起notepad++、editplus,vscode集成了许多IDE才具有的功能,比起它们更像一个代码编辑器;比起sublime,vscode颜值更高,安装配置插件更为方便;比起atom,vscode启动速度更快,打开各种大文件不卡。可以说,vscode既拥有高自由度、又拥有高性能和高颜值,最关键的是,vscode还是一款免费并且有团队持续快速更新的代码编辑器。可以说,vscode是代码编辑器的首选。个人推荐编写前端代码时,代码编辑器选择vscode,IDE选择WebStorm。vscode安装插件只需要点击图片所示按钮,即可进入拓展,在搜索框中输入插件名点击安装后,等待安装好即可点击重新加载重启vscode使得插件生效。


1、Chinese (Simplified) Language Pack for Visual Studio Code.
此中文(简体)语言包为 VS Code 提供本地化界面。安装后,在 locale.json 中添加 “locale”: “zh-cn”,即可载入中文(简体)语言包。要修改 locale.json,你可以同时按下 Ctrl+Shift+P 打开命令面板,之后输入 “config” 筛选可用命令列表,最后选择配置语言命令。


可以将编译器汉化。非常适合英文不好的同学。

2.Code Debugger


无需配置launch.json即可进行单文件调试,点击右上角虫子图标或者右键菜单都可以。
支持JS、TS、Python、Dart、Coffeescript、Go、C/C++、Rust、Bash、Lua

3.Debugger for Chrome


支持谷歌浏览器调试bug

4.ES7 React/Redux/GraphQL/React-Native snippets  


在 VS Code 中支持 React Native,React,Redux 常见代码片段的插件.

5.ESLint 


ESLint 是一个代码规范和错误检查工具,所有东西都是可以插拔的。你可以调用任意的rule api或者formatter api 去打包或者定义rule or formatter。任意的rule 都是独立的。没有特定的coding style,你可以自己配置。

6.GitLens — Git supercharged


GitLens一个很厉害的vscode的git插件,支持在编译器终端git各种操作。

7.HTML CSS Support 


在编写样式表的时候,自动补全功能大大缩减了编写时间。

8.JavaScript (ES6) code snippets 


支持ES6语法提示。

9.Mithril Emmet 
 

Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具. 在前端开发的过程中,一大部分的工作是写 HTML、CSS 代码。特别是手动编写 HTML 代码的时候,效率会特别低下,因为需要敲打很多尖括号,而且很多标签都需要闭合标签等。于是,就有了 Emmet,它可以极大的提高代码编写的效率,它提供了一种非常简练的语法规则,然后立刻生成对应的 HTML 结构或者 CSS 代码,同时还有多种实用的功能帮助进行前端开发。VsCode内置了Emmet语法,在后缀为.html/.css中输入缩写后按Tab键即会自动生成相应代码.

10.Path Intellisense 


路径提示插件。

11.Prettier - Code formatter 


对代码进行快速格式化。

12.Vue 3 Snippets


这是一款在 Vue 2 或者 Vue 3 开发中提供代码片段,语法高亮和格式化的 VS Code 插件,能极大提高你的开发效率

13.VueHelper


vscode最好的vue代码提示插件,不仅包括了vue2所有api,还含有vue-router2和vuex2的代码提示.(此插件作者已转行做影视,可以使用Vue 3 Snippets,如果不使用本插件)。

VS code快捷键


好啦,本期内容就分享到这里,我们下期见!



浏览 83
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报