分享一些VSCode开发常用插件

介绍

随着时代的发展,越来越多的开发者选择使用VSCode进行开发,这款跨平台编辑器拥有强大的功能和丰富的扩展插件。

本文将分享一些常用的VSCode开发插件,旨在提高开发效率、优化开发体验。

插件列表

1. Prettier - Code formatter (#1)

作为一个代码格式化插件,Prettier - Code formatter拥有快速、高效的格式化工具,它能够帮助开发者更快速地写出一致性高、可读性强的代码。

在VSCode中安装Prettier - Code formatter插件后,在设置中打开Editor: Format On Save选项,即可在保存时快速进行代码格式化。

Prettier - Code formatter的使用示例:

// 在文件中写下以下代码

function Hello(){

console.log("Hello World");

}

// 将代码格式化为统一风格的代码

function Hello() {

console.log("Hello World");

}

2. Bracket Pair Colorizer (#2)

Bracket Pair Colorizer是一款会让你找到花括号能够切换的插件,帮助开发者更快速地找到匹配的括号。

安装后,括号会在编辑器中以不同的颜色进行高亮,帮助开发者更方便的进行编写和查看。此外,它还支持颜色 customization,并提供灵活高效的配置方式。

Bracket Pair Colorizer的使用示例:

// 在文件中写下以下代码

function testFunc() {

if (condition1) {

// do something

} else if (condition2) {

// do something

} else {

// do something

}

}

// 编辑器中对应的视图

function testFunc() {

if (condition1) {} else if (condition2) {} else {}

}

3. GitLens (#3)

GitLens是一款很不错的Git代码管理插件,支持git blame, inline-diff 和 annotations等特性。你可以方便地查询和比较不同 commit 版本中的代码更新、作者等信息,并且支持高效的代码检索。

GitLens的使用示例:

// 查看当前文件的 git blame 信息

// 例如:某一行的代码信息

[ncomal@localhost ~]$ git blame xxx.c -L 82,82

4d99e13f ( xx 2019-03-21 14:45:22 +0800 82) crc_result.u32Data = 0x01234567;

4. Live Server (#4)

Live Server是一款支持自动刷新静态HTML/CSS/JS文件的插件。当你启动Live Server之后,在编辑器中保存代码,浏览器的页面就会自动刷新,帮助你更有精力地专注于开发工作本身。

此外,Live Server还具有诸多优秀的功能,如支持资源压缩,支持https,还可以自定义端口、浏览器实例等等

Live Server的使用示例:

// 在html文件中打开右键菜单,选择Open With Live Server

// 在服务器引擎上启动了应用程序并打开了它,文件中任何更改都将自动刷新页面。

5. Remote - SSH (#5)

Remote - SSH是一款远程连接插件,方便开发者通过VSCode来管理服务器。使用这款插件,开发者可以在本地使用VSCode进行使用,但却可以连接到远程服务器进行代码编写调试。

Remote - SSH的使用示例:

// 创建远程SSH连接

// 在命令面板中选择Remote-SSH: Connect to Host,输入完整的用户名和SSH地址。输入密码或身份验证SSH密钥。连接成功后,插件将打开一个新的VSCode实例并连接到服务器。

总结

以上插件是VSCode编辑器中受欢迎的插件。它们不仅提高了开发效率,还极大地方便了开发者的工作。当然,随着我们的编码要求越来越高,我们还需要不断地探索和学习更多的插件。

免责声明:本文来自互联网,本站所有信息(包括但不限于文字、视频、音频、数据及图表),不保证该信息的准确性、真实性、完整性、有效性、及时性、原创性等,版权归属于原作者,如无意侵犯媒体或个人知识产权,请来电或致函告之,本站将在第一时间处理。猿码集站发布此文目的在于促进信息交流,此文观点与本站立场无关,不承担任何责任。