2020年,9个前端的顶级 VS Code 扩展插件

647次阅读  |  发布于3年以前

VS Code 的插件甚至是主题都数不胜数,开发者根据自己的需求可以自由选择。一个配置合适的 VSC 可以提高开发效率,有的则能够帮助开发者写出更简洁美观的代码。在大量的插件中,为了避免大家挑花眼,我在这里和大家分享12个我个人认为对前端开发最有利的扩展。

1. CSS Peek

下载量:102w

这款插件在你的html中鼠标指向某个class或者id名称按住Ctrl键+鼠标左键可以直接定位到该名称的CSS的位置,可以说是大大提高了开发效率。

2. 代码检查 ESLint

下载量:1019w

网站:https://eslint.bootcss.com/

JavaScript 可能很难调试,但 ESLint 扩展可以使这个过程更容易。它能够在执行代码之前帮你指出其中潜在的问题。更强大的是它允许你创建自己的 linting 规则。

3.Node 扩展 NPM

下载量:274w

所有开发者应该都认识NPM,其全称是Node Package Manager(node包管理器)。该扩展插件有助于管理Package.json,当生产环境依赖包未安装时会发出警告,并确保安装的版本正确。

4. 调试器 Debugger for Chrome

下载量:612w

对于在运行时期间对代码进行调试的开发人员,Debugger for Chrome 将帮你更好的完成工作。它有许多方便的功能,包括在代码、watches 和控制台中设置断点的功能。另外你可以在 VS Code 中运行Chrome实例,或把调试器附加到单独运行的浏览器实例。

5.代码片段扩展 JavaScript Code Snippets

下载量:377w

目前最流行的,迄今为止安装量超过 377 万。此扩展为 JavaScript , TypeScript ,HTML,React和Vue扩展提供 ES6 语法支持。

6 . 代码格式化扩展 Prettier

下载量:763w

说到漂亮整洁的代码,Prettier 听名字你就值得拥有。尤其在项目需要你和其他同事合作完成时,Prettier 会强势地将代码格式全部统一,让你再也不用和同事讨论自己的代码。

7. 语法高亮 Beautify

下载量:516w

它同Prettier十分类似,是一种出色的代码格式化扩展插件,近1200万的下载量足以说明一切。可以用它格式化以JavaScript,JSON,CSS,Sass和HTML编写的代码。

8. Vetur

下载量:518w

对 Vue.js 开发,有一个叫 Vetur 的扩展相当棒,它目前的下载量已经有将近2,000万。Vetur 的功能很强大,包括代码片段,Emmet,错误检查,格式化,调试和高亮语法等。

9:Git增强:GitLens

下载量:594w

虽然Git功能已内置于 VS Code 中,但 GitLens 能够提供更多的版本控制功能来“增强”你的编辑器。它提供了对代码的深入分析功能,可以向你显示更改时间以及更改后的代码。你甚至可以比较不同的分支、标签和提交。总的来说,这个扩展插件会让你拥有全新的视觉感受。

Visual Studio Code 成为最流行的 Javascript IDE 已经有一段时间了。我个人认为 VS Code 是个很好用的编辑器,在自定义方面它的自由度很高,并且有了自带的 git 功能,这也避免了你在不同的窗口间来回切换。

Copyright© 2013-2020

All Rights Reserved 京ICP备2023019179号-8