VisualStudioCode：10个不可或缺的扩展插件

VisualStudioCode：10个不可或缺的扩展插件

VisualStudioCode无疑是当今最流行的轻量级代码编辑器。它确实从其他流行的代码编辑器(比如：SublimeText和Atom)中借鉴了大量的功能和特性。然而，它的成功主要来自于其提供更好性能和稳定性的表现。此外，它还提供了如代码智能提示(IntelliSense)等开发者非常需要的功能。而这些功能，曾经只在像Eclipse或者VisualStudio2017这样的集成开发环境(IDE)中才可用。

VSCode的强大无疑来自于它的扩展市场，由于有非常活跃的开源社区，VSCode现在几乎支持所有的编程语言、框架和开发技术。对库或框架的支持有多种方式，主要包括针对该特定技术提供代码片段，语法突出显示，Emmet以及智能提示(IntelliSense)功能。目前，有许多符合此条件的VSCode扩展，下面介绍10种对JavaScript开发人员来说不可或缺的VSCode扩展。

1. 代码片段扩展

当您第一次安装VSCode时，它附带了几个JavaScript和Typescript的代码片段功能。在开始编写现代JavaScript之前，您需要一些额外的代码片段来帮助您快速编写重复的ES6/ES7代码。以下是其中几个：

• VSCodeJavaScript(ES6)snippets
• JavaScriptSnippetPack
• AtomJavaScriptSnippet
• JavaScriptSnippets

2. 语法扩展

VSCode为JavaScript代码提供了非常好的语法高亮显示。您可以通过安装主题来更改颜色。但是，如果您想要增强代码的可读性，则需要语法高亮显示扩展。以下是其中几个：

• JavaScriptAtomGrammar
• BabelJavaScript
• DotENV

3. 代码检测扩展

编写有效的JavaScript代码时，需要一个能够为所有团队成员强制执行特定编码风格的检测工具(linter)。ESLint是最受欢迎的，因为它支持许多编码风格，包括Standard，Google和Airbnb。以下是VisualStudioCode最流行的linter插件：

• ESLint
• JSHint
• JavaScriptStandardStyle
• JSLint

4. Node扩展

每个JavaScript项目都需要至少一个Node包，除非你是一个喜欢艰苦工作的人。以下是一些VSCode扩展，可帮助您更轻松地使用Node模块。

• npm
• Node.jsModulesIntelliSense
• PathIntelliSense
• Nodeexec
• ViewNodePackage
• NodeReadme
• Searchnode_modules
• ImportCost

5. 代码格式化扩展

为了节省时间，您可以以下任何的VSCode扩展来快速格式化和重构现有代码：

• Beatufy
• PrettierCodeFormatter
• JSRefactor
• JavaScriptBooster

6. 浏览器扩展

除非你是在用JavaScript编写控制台程序，否则您很可能会在浏览器中执行JavaScript代码。这意味着,您需要经常刷新页面来查看您所做的每次代码更新的效果。这里有一些工具可以显着减少重复过程的开发时间，而不是每次都手动刷新浏览器：

• DebuggerforChrome
• LiveServer
• PreviewonWebServer
• PHPServer
• RestClient

7. 框架类扩展

对于大多数项目，您需要一个合适的框架来构建代码并缩短开发时间。VSCode通过扩展支持大多数主流框架。但是，仍然有许多已建立的框架尚未完全支持。以下是一些提供重要功能的VSCode扩展。

• Angular6
• Angularv5snippets
• ReactNative/React/Reduxsnippetsfores6/es7
• ReactNativeTools
• Vetur
• Ember
• CordavaTools
• jQueryCodeSnippets

8. 测试类扩展

测试是软件开发的关键环节，特别是对于处于生产阶段的项目。以下是一些测试类扩展：

• Mochasidebar
• ESMochaSnippets
• JasmineCodeSnippets
• ProtractorSnippets
• NodeTDD

9. awesome类扩展

还有一些非常棒的扩展：

• Quokka.js
• PasteasJSON
• CodeMetrics

10. 扩展包

VSCode市场有一个扩展包类别。从本质上讲，它们是相关联的一些VSCode插件的集合，打成一个包，方便安装。以下是一些较好的：

• NodejsExtensionPack
• VSCodeforNode.js–DevelopmentPack
• Vue.jsExtensionPack
• IonicExtesionPack

VSCode的大量质量扩展使其成为JavaScript开发人员的热门选择，想要成为一名优秀的前端开发工程师，VScode插件一定要知道。

更多web前端开发资料，可以关注“武汉千锋”微信公众号！