如今，visual studio code无疑是最流行的轻量级代码编辑器。它确实从其他代码编辑器那借鉴了很多，最主要是从sublime和atom那里。然而它的成功关键是源于能提供更好的性能和稳定的表现。
另外，它还提供了如代码智能提示等开发者非常需要的功能。而这些功能，曾经只在像eclipse或者visual studio 2017这样的完整集成开发环境(ides)中才有。
vs code的强大无疑来自于它的插件市场。多亏了开源社区，vs code现在几乎对所有的编程语言、框架和开发技术都有支持。提供这种支持的方式是多样的，主要包括了为特定技术提供代码片段、语法高亮、emmet以及智能提示功能。
vs code插件的种类在本文，我主要介绍专门针对javascript开发者的vs code插件。有很多满足此条件的vs code插件，当然我不会都作介绍。相反，我会着重介绍那些已经相当流行而且对javascript开发者来说必不可少的vs code插件。为简单起见，我把它们分为10类。
在这之中可能有你已经知道并且正在使用的插件，但也很有可能有一些是你听说过但未曾使用过的，我也希望通过本文能为你简要的介绍一下这些插件。
1. 代码片段插件当你第一次安装vs code时，它会附带一些javascript和typescript的代码片段。在你开始上手现代javascript之前，你将需要一些额外的代码片段来帮助你快速地编写es6/es7代码：
vs code javascript(es6) snippets：当前最流行的，已有超过120万的下载量。这个插件为javascript、typescript、html、react和vue提供了es6的语法支持。
javascript (es6) code snippets in standardjs style：这基本上是前一个扩展的分支，但没有分号。
atom javascript snippet：移植自atom的javascript插件。
javascript snippets：提供了es6代码片段的集合。它包含对mocha、jasmine等其他bbd(behavior-driven development)测试框架的支持。
2. 语法高亮插件最新版本的vs code目前支持变量和函数引用的着色。它现在更像是atom.io编辑器语法，因此不再需要诸如javascript atom grammar之类的扩展。
但是，我们仍然有一些语法突出显示扩展，这些扩展在某些项目中很有用。这是一对夫妇：
babel javascript：支持es201x、react、flowtype以及graphql的语法高亮。
dotenv：支持.env文件语法高亮，在你使用node时会非常有用。
3. 代码检测插件以最小的烦恼高效编写javascript代码，需要一个代码检测(linter)工具。它强制团队所有成员遵循特定的代码规范。eslint是最受欢迎的，它支持许多代码风格，包括standard、google和airbnb的javascript代码规范。这里是最流行的vs code代码检查插件：
eslint：这个插件把eslint集成到vs code中。它是最流行的代码检测插件，已有超过670万下载量。它的规则在.eslintrc.json里配置。
jshint：基于jshint的代码检测插件。在项目跟目录下使用.jshintrc文件作为其配置。
javascript standard style：零配置和严格规则的代码检测，强制使用standardjs规则。
jslint：jslint的linter扩展。
如果你想查看对各种代码检测优缺点的综述，可以来看看我们对代码检测工具的比较。
4. node插件每一个javascript项目都需要至少一个node package，除非你是那种喜欢以艰难的方式做事的人。这里有一些vs code插件，能帮你更容易的处理node模块。
npm：用package.json来校验安装的npm包，确保安装包的版本正确，对缺少package.json文件的包或者未安装的包给出高亮提示。
npm intellisense：在import语句中自动完成npm模块。
path intellisense：它其实与node没有关系，但是你肯定需要对本地文件的智能提示，这个插件会自动补全文件名。
node exec：允许你用node执行当前文件或者选中的代码。
view node package：利用此插件可快速查看node包源码，让你直接在vs code中打开node包的代码库或文档。
node readme：快速打开npm包文档。
search node_modules：通常node_modules文件夹不在默认的搜索范围内，这个插件允许你搜索它。源码：vscode-search-node-modules。
import cost：显示导入的包的大小。源码：import-cost。
5. 代码格式化插件有时，你发现自己会对以前写过的风格不太理想的代码做格式整理。为了节约时间，你可以安装以下任何的vs code插件，来快速地格式化和重构现有代码：
beatufy：一个jsbeautifier的插件，支持javascript、json、css和html。可通过.jsbeautifyrc文件自定义。它是最流行的格式化工具，目前有230万的下载量。
prettier code formatter：利用prettier的支持javascript、typescript和css的插件，目前有超过150万的下载量。
js refactor：提供许多重构javascript代码的实用方法和操作，例如抽取变量和方法，把现有代码转为使用箭头函数和模板字符串的等价形式，导出函数等。
javascript booster：一款了不起的代码重构工具。拥有需要代码操作，比如把var转为const或者let，去除多余的else语句，合并声明和初始化。其灵感大量源于webstorm的启发。源码：vscode-javascript-booster。
6. 浏览器插件除非你是在用javascript写控制台程序，否则你多半会在浏览器中执行你的javascript代码。这意味着，你会频繁地刷新浏览器以观察每次你更新代码的效果。这里有一些工具，能极大地减少你开发时的这种重复流程，而不是每次都手动刷新浏览器：
debugger for chrome：在编辑器中打断点，让你轻松地在chrome里调试javascript。源码：vscode-chrome-debug。 
live server：开启本地开发时服务器，为静态和动态页面提供实时刷新功能。源码：vscode-chrome-debugvscode-live-server。
preview on web server：提供web服务器和实时预览功能。
php server：对测试只能在客户端运行的javascript代码很有用。
rest client：相较于用浏览器或者一个curl程序来测试你的rest api端点，你可以安装这个工具，直接在编辑器里相互性地发http请求。
7. 框架类插件对于大多数项目，你会使用合适的框架去构建你的代码，以减少开发时间。vs code通过插件对大多数主流框架都做了支持。然而，仍有一些特定框架没有得到完全的支持。下面是一些提供了强大功能的vs code插件。
angular 7 snippets：angular 2,4,5,6,7和8 beta的片段。支持typescript，html，angular material ngrx，rxjs，pwa和flex layout。迄今为止包含237个角度片段。
angular v7 snippets：提供针对typescript、rxjs、html和docker文件的代码片段。目前有270多万的下载量。
es7 react/redux/graphql/react-native snippets：使用babel插件功能提供es7语法中的react / redux代码段。包含javascript和typescript的代码段。
react native tools：为react native框架提供代码智能提示、命令行工具和调试特性。
react-native/react/redux snippets for es6/es7：为es6 / es7语法中的react，react native，redux和storybook提供es6 / es7语法片段。
vetur：为vue框架提供语法高亮、代码片段、emmet、代码检测、智能提示和调试支持。它带有很好的发布在gitbook上的文档。
ember：为ember提供了命令行支持和智能提示。安装完后，所有ember cli的命令可直接在vs code自己的命令行列表中使用。
cordava tools：支持cordava插件和ionic框架，提供基于cordova的项目的智能提示、调试已经其他特性的支持。
jquery code snippets：提供了超过130个jquery的代码片段，使用jq前缀来激活。
8. 测试类插件测试是软件开发的关键部分，特别是对于处于生产阶段的项目。您可以在javascript中全面了解测试，并阅读有关您可以在我们的指南中运行的各种测试的更多信息，javascript测试：单元与功能与集成测试。这里有一些针对测试的vs code插件：
mocha sidebar：利用mocha库为项目提供单元测试。这个框架帮你直接在代码里跑测试，把错误信息以装饰器形式显示出来。
es mocha snippets：提供es6语法的mocha代码片段。这个插件的重点在于利用箭头函数，尽可能减少花括号的使用，保持代码的紧凑。可通过设置允许使用分号。
jasmine code snippets：针对jasmine测试框架的代码片段。
protractor snippets：针对protractor端到端测试框架的代码片段。支持javascript和typescript。
node tdd：为node和javascript项目提供测试驱动开发的支持。能在源码的更新后，立即触发自动化测试的构建。源码：node-tdd
9. 其他棒棒的插件我把下一批vs code的插件归为厉害的(awesome)这一类，因为这个描述恰到好处。
quokka.js：非常厉害的调试工具，为javascript提供了快速构建原型的演练场，并且附带有很好的文档。
paste as json：快速地将json数据转为javascript代码。源码：quick-type。
code metrics：这是另一个非常棒的插件，计算javascript和typescript代码中复杂度。源码：codemetrics。
10. 插件包现在我们来到了最后一类，我想让你知道，vs code市场有有一个插件包的分类。本质上，它们是相关联的一些vs code插件的集合，打成一个包，方便安装。这里有些较好的：
nodejs extension pack：这个包里有eslint、npm、javascript(es6) snippets、search node_modules、npm intellisense和path intellisense。
vs code for node.js - development pack：这个包含npm intellisense、eslint、debugger for chrome、code metrics、docker和import cost。
vue.js extension pack：一些vue和javascript插件的集合。目前它含有12个vs code的插件，有一些之前我们没有提到的，比如auto-rename-tag和auto-close-tag。
ionic extesion pack：这个包里有针对ionic、angular、rxjs、cordova和html开发的插件。
总结vs code拥有大量的高质量插件，这让它在javascript开发者群体中广受欢迎。写javascript代码，再没有比现在更容易了。
　●　像eslint这样的插件，帮助你避免代码中的常见错误；
　●　debugger for chrome，帮助你更容易地调试代码；
　●　带有智能提示的node.js插件帮助你正确引用模块；
　●　像live server和rest client这样的可用工具，让你在完成工作时减少了对外部工具的依赖；
　●　再比如spreadjs纯前端表格控件，让在线excel嵌入您的应用。
所有这些工具，都极大地加快了你的迭代流程。
我希望这些列表让你接触到新的vs code插件，对你的工作流程有帮助。
推荐教程：vscode教程
以上就是适用于javascript开发人员的10个必备vscode扩展的详细内容。