译者按: 看完这篇文章,我打算从 Sublime Text 转到 Visual Studio Code 了!

为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,翻译仅用于学习。

我们的 VSC(VSCode)将会像一个长了五只可以发射激光的独角兽一样!接下来会介绍我每天使用的非常有用的插件。

如果你还是一个 VSC 的新手,那么点击左侧最下方的按钮来安装插件。

Material Theme

下载量:130 万

Visual Studio Code 最悠久的主题!

Auto Import

下载量:46 万

自动去查找、分析、然后提供代码补全。对于 TypeScript 和 TSX,可以适用。

Import Cost

下载量:41 万

该插件会在行尾显示导入的包的大小。为了计算包大小,该插件要使用 Webpack 和 babili-webpack-plugin。

Indent-Rainbow

下载量:13 万

一个简单的插件可以使得对齐更加具有可读性。

IntelliSense for CSS class names in HTML

下载量:243 万

基于你的项目以及通过link标签引用的外部文件,该智能插件提供 HTML 中 CSS class 名字的补全。

SVG Viewer

下载量:29 万

一个用来预览 SVG 的插件。

Prettier

下载量:357 万

你绝对不能少了这个插件,你需要它来一键美化你的 JavaScript/TypeScript/CSS 代码。

React Native Tools

下载量:218 万

代码提示、Debugging、集成 RN 的命令。

Sublime Text Keymap and Settings Importer

下载量:76 万

从下载量来看,看来不少人从 Sublime Text 转移过来了。

这个插件将 visual studio code 的快捷键绑定改成了和 Sublime Text 3 一样。你可以试一试:cmd + P (Mac),ctrl + P (Windows)。

你可以跳转到文件,如果在搜索前添加>符号,你甚至可以搜索动作,比如打开内置的终端、安装插件等等。

对于习惯使用 ST3 的人,这是一个很大的加分项。

npm Intellisense

下载量:88 万

VSCode 插件可以在导入语句自动补全 npm 模块名称。

lit-html

下载量:3 万

在 JavaScript/TypeScript 的文件中,如果有使用到 HTML 标记,lit-html 提供语法高亮和相应的补全支持。

highlight-matching-tag

下载量:6 万

这本来应该是 VSCode 应该默认提供的功能,高亮匹配的标签。

GitLens

下载量:772 万

啥也别说,直接上图!

Git Project Manager

下载量:37 万

Git Project Manager 可以然你直接一键搜索并打开某个的基于 Git 管理的项目。

Git History

下载量:332 万

用来查看 git log 或则一个文件的 git 历史,比较不同的分支,commits。

File Utils

下载量:8 万

提供了一个更加简洁的方法来创建、复制、移动、重命名、删除文件/文件夹。

Bracket Pair Colorizer

下载量:228 万

如果你的代码有很多的回调,那么这种高亮可以帮助你更好地区分不同的代码块。

Color Highlight

下载量:25 万

直观展示你定义的颜色。

CSS Peek

下载量:23 万

可以在 HTML 中通过 CSS id 或则 class 来定位到其定义。

Debugger for Chrome

下载量:1111 万

用 Chrome 来 Debug 你的 JavaScript 代码,或则其它支持 Chrome Debugger 协议的平台。

Quokka.js

下载量:172 万

实时执行 JavaScript 代码(做快速的 demo 很有用)。

Trailing Spaces

下载量:7 万

高亮那些冗余的空格,可以快速删掉。

TypeScript Hero

下载量:72 万

辅助用 TypeScript 编程的童鞋!

WakaTime

下载量:24 万

从你的使用习惯中生成数据报表。

Vetur

下载量:451 万

VS Code 下面的 Vue 工具!有 Pine Wu 开发,已经累计 400 多万下载量!

Code Runner

下载量:346 万

支持多种语言的代码的立即执行。支持的语言:C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script, C# (.NET Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script, R, AppleScript, Elixir, Visual Basic .NET, Clojure, Haxe, Objective-C, Rust, Racket, AutoHotkey, AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D。

PHP IntelliSense

下载量:415 万

vscode-icons

下载量:799 万

Icon 集合。

Jest

下载量:29 万

愉快地使用 Facebook 的 Jest。

React.js code snippets

下载量:59 万

用 ES6 语法去开发 React.js 应用非常方便。

30个极大提高开发效率的Visual Studio Code插件的更多相关文章

  1. 30 个极大提高开发效率超级实用的 VSCode 插件

    Visual Studio Code 的插件对于在提升编程效率和加快工作速度非常重要.这里有 30 个最受欢迎的 VSCode 插件,它们将使你成为更高效的搬砖摸鱼大师.这些插件主要适用于前端开发人员 ...

  2. 30个极大提高开发效率的vscode插件

    参考链接:https://blog.fundebug.com/2018/07/24/vs-extensions/

  3. ionic2——开发利器之Visual Studio Code 常用插件整理

    1.VsCode官方插件地址: http://code.visualstudio.com/docs 2.使用方法,可以在官网中搜索需要的插件或者在VsCode的“”扩展“”中搜索需要的插件 添加方法使 ...

  4. .Net Core 常用开发工具(IDE和运行时、Visual Studio插件、Visual Studio Code插件)

    IDE和运行时 组件名 描述 可选版本 推荐版本 Visual Studio Community 社区免费版 For Visual Studio 2017 For Visual Studio 2019 ...

  5. 令人惊叹的Visual Studio Code插件

    vscode是一款开源且优秀的编辑器,接下来让我吐血推荐一下我工作使用过的令人惊叹的Visual Studio Code插件. 代码编辑插件 vscode-color-highlight ------ ...

  6. 安装GO语言环境之安装Visual Studio Code插件

    在安装Visual Studio Code插件的时候,由于谷歌的限制,在下载下列插件的时候会报错: go get -u -v github.com/nsf/gocode go get -u -v gi ...

  7. 对于Web开发最棒的22个Visual Studio Code插件

    翻译    原文作者:James Quick    原文地址:https://scotch.io/bar-talk/22-best-visual-studio-code-extensions-for- ...

  8. Salesforce 开发新工具 - Visual Studio Code

    最近尝试使用Visual Studio Code来做Salesforce的开发工具,体验上比Sublime好用不少,介绍下详细步骤 第一步:下载对应版本的Visual Studio Code 下载地址 ...

  9. Ubuntu上配置vtk开发环境——基于visual studio code 与 gcc

    环境说明 vtk版本7.1.1 visual studio 1.16.1 Ubuntu 16.04 + 自带的gcc 编译过程与windows下类似还好,运行自己的代码开始面对cmake与make的各 ...

随机推荐

  1. 在windows 下使用eclipse进行编译和烧写

    eclipse IDE是一款开源的前端编程软件,它提供了编写,编译和调试ESP-IDF项目的图形集成开发环境. 首先在https://www.obeo.fr/en/eclipse-download?I ...

  2. 前端vue框架 父组件与子组件之间的相互调用

    子组件调用父组件东西: 1.在父组件与子组件契合的标签的的template模板中绑定 v-bind:自定义一个名字=“要调用的名字” 2.在子组件的script中props:["自定义的名字 ...

  3. yum-内网yum源服务器配置(CentOS6.5)

    一.安装apache服务1.安装httpd服务 yum -y install httpd (纯内网用rpm包安装也可以) 2.启动httpd服务 service httpd start 二.挂载完整的 ...

  4. PMP:4.项目整合管理

    内容中包含 base64string 图片造成字符过多,拒绝显示

  5. boost::bind 实现原理, 手动实现一个

    template<typename R, typename T, typename A1> class hangj_call { public: hangj_call(R (T::*f_) ...

  6. ES6教程-字符串,函数的参数,了解函数的arguments对象,js面向对象,设计模式-单例模式,解构赋值

    前言 主要讲解了ES6对字符串的拓展,包括includes,startsWith和endsWith,另外增加了字符串模板. Start includes()是否包含 startsWith()以什么开头 ...

  7. [Swift]键盘遮挡控件

    键盘遮挡控件: super.viewDidLoad(){ // Do any additional setup after loading the view, typically from a nib ...

  8. python 打印堆栈信息方法

    第一种方法使用logging模块 import logging def test(self): try: 1 / 0 # 触发异常 except BaseException as e: logging ...

  9. Django--Ajax 提交

    一 什么是Ajax AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异步交互,传 ...

  10. php上传大文件失败处理

    下面分别是各种原因以及解决办法:第1种情况:文件上传时存放文件的临时目录必须是开启的并且是 PHP 进程所有者用户可写的目录.如果未指定则 PHP 使用系统默认值.php.ini文件中upload_t ...