30个实用VSCode 插件,让你的开发效率倍增!

article/2025/10/4 8:36:27

1. Image preview

通过此插件,当鼠标悬浮在图片的链接上时,可以实时预览该图片,除此之外,还可以看到图片的大小和分辨率。

2. Auto Rename Tag

使用该插件,可以在重命名一个 HTML 标签时,自动重命名 HTML 标签的开始和结束标签。避免只修改了开始标签,而忘记修改结束标签。该扩展适用于 HTML、XML、PHP 和 JavaScript。

3. Bracket Pair Colorizer

使用该插件可以用不同颜色区分出代码中的括号,对于括号很多的代码非常实用。该插件还支持自定义括号颜色。

4. Color Highlight

此扩展可以用来设置 CSS 颜色的样式。除了 CSS 之外,它还会对不显示默认颜色的 JavaScript、HTML、JSON 等文件进行着色。该插件会对颜色名称、RGB、RGBA 和十六进制颜色进行着色。

5. Better Comments

Better Comments 扩展可以帮助我们在代码中创建更人性化的注释,有不同形式和颜色的注释供我们选择。

6. GitLens

GitLens 增强了 Visual Studio Code 中内置的 Git 功能。它可以帮助我们更好地理解代码,快速了解更改行或代码块的人员、原因和时间。

7. VSCode-Icons

VSCode-Icons 是一个文件图片插件,可以为项目不同类型的文件赋予不同的图标。让我们更容易区分不同的文件类型。

安装完成之后,按照以下步骤进行使用:文件 → 首选项 → 文件图标主题 → VSCode-Icons。

8. Tabnine

Tabnine 是一个多语言的插件,可以自动帮助我们完成代码的输入。Tabnine 的目标是通过基于 AI 的系统提高开发人员的生产力。

9. Project Dashboard

Project Dashboard 是一个项目仪表板插件,可以将经常访问的文件夹、文件等固定到仪表板上以快速访问它们。

10. CodeSnap

CodeSnap 是一个代码截图插件,只需选中项目中相应的代码段,即可快速创建代码的截图。

11. CSS Peek

CSS Peek 插件允许我们在 HTML 中选择某个 class 或者 id 名称按住Ctrl键+鼠标左键可以直接定位到该名称的CSS的位置。

12. Path Autocomplete

Path Autocomplete 提供了路径自动完成,因此不必记住那些很长的文件路径。

13. Auto Close Tag

Auto Close Tag 插件用于自动补全HTML结束标签。

14. Vetur

Vue 开发必备插件,它为 Vue.js 提供了实用的工具,例如调试、错误检查、语法高亮、片段等。

15. IntelliCode

IntelliCode 旨在帮助开发人员提供智能的代码建议。它默认支持 Python、TypeScript/JavaScript、React 和 Java。IntelliCode 将最有可能使用的内容放在列表的顶部,从而节省时间。IntelliCode 建议基于 GitHub 上的数千个开源项目。

16. Import Cast

该插件用于在编辑器中内联显示导入包的大小。该扩展使用 webpack 来检测导入包的大小。

17. Beautify

Beautify 可以帮助我们以更美观的方式格式化代码。它支持 JavaScript、JSON、CSS、Sass 和 HTML 等流行语言。

18. Code Time

Code Time 可以计算我们使用 Visual Studio Code 的时间,提供了多种数据指标。

19. Settings Sync

Settings Sync 用于将 Visual Studio Code 的设置保存在 GitHub 上,并轻松地将其用于其他计算机,例如有关扩展的信息或系统设置。使用该插件就可以轻松地为许多不同的机器进行设置,而无需打开之前安装的扩展和相关设置。

20. Live Share

Live Share 帮助团队中的开发人员实时共享程序中的代码,从而轻松编辑和调试程序,例如共享调试会话、终端实例、localhost Web 应用程序、语音通话等。

21. Code Spell Checker

Code Spell Checker 可以帮助我们检查单词拼写是否出现错误,检查的规则遵循 camelCase (驼峰命名法)。

22. Error Lens

Error Lens 是一款把代码检查(错误、警告、语法问题)进行突出显示的插件。Error Lens 通过使诊断更加突出,增强了语言的诊断功能,突出显示了由该语言生成的诊断所在的整行,并在代码行的位置以行方式在线打印了诊断消息。

23. ES7 React/Redux/GraphQL/React-Native snippets

React/Redux/Reatc Native/react-router 语法智能提示,React 开发者必备。借助此代码段,可以轻松创建基于类的组件、function组件。

24. REST Client

REST Client 允许发送 HTTP 请求并直接在 VS Code 中查看响应。它是 VS Code 的 Postman,可以方便地集成到代码编辑器中。REST 客户端同时支持 REST 和 GraphQL API。

25. JavaScript Booster

JavaScript Booster 通过分析代码及其上下文自动建议快速操作以重构或增强代码。它支持来自重构条件、声明、函数、TypeScript、promise、JSX 等的多种代码操作。

26. Live SASS Compiler

Live SASS Compiler 扩展可以将 SASS 或 SCSS 文件实时编译或转译为 CSS 文件。

27. Remote-SSH

Remote-SSH 可以使用任何带有 SSH 服务器的远程机器作为开发环境。由于扩展直接在远程机器上运行命令,因此无需在本地机器上放置源代码即可快速操作远程服务器。

28. Debugger for chrome

Debugger for Chrome 是微软开发的插件,它允许我们在 VS Code 中调试 JS 代码。可以设置断点、逐步执行代码、调试动态添加的脚本等。它有助于在开发过程的早期检测错误。

29. npm Intellisense

npm 安装包之后,在 require 时提供该插件可以获得智能提示,import 语句中自动填充 npm 模块。

30. Live Server

Live Server是一个具有实时加载功能的小型服务器,可以在项目中用live-server作为一个实时服务器实时查看开发的网页或项目效果。

它是为静态和动态页面启动具有实时重新加载功能的本地开发服务器,在状态栏中单击即可启动或停止服务器。


http://chatgpt.dhexx.cn/article/3J4PEuxd.shtml

相关文章

VScode神仙插件,程序员必备

前言 Visual Studio Code(VS Code)是微软2015年推出的一个轻量但功能强大的源代码编辑器,基于 Electron 开发,支持 Windows、Linux 和 macOS 操作系统。它内置了对JavaScript,TypeScript和Node.js的支持并且具有丰富的其它语言和扩展的支持&a…

2023年最新最全 VSCode 插件推荐

Visual Studio Code 是由微软开发的一款免费的、针对于编写现代Web和云应用的跨平台源代码编辑器。它包含了一个丰富的插件市场,提供了很多实用的插件。下面就来分享 2023 年前端必备的 VS Code 插件! 前端框架 ES7 React/Redux/React-Native snippets …

VSCode 最全实用插件(VIP典藏版)

目录 前言 一、必备插件 🌾Chinese(中文) 🤡Settings Sync(配置同步到云端) ​🌈wakatime(编程时间及行为跟踪统计) 二、效率神器 ✨HTML Snippets(代码提示&…

SaaS行业持续升温,这里有你想了解的SaaS云服务优势

SaaS(Software as a Service)——软件即服务,是一种软件交付模式。SaaS最大的特色在于软件本身并没有被下载到用户的硬盘,而是存储在提供商的云端或者服务器。对比传统需要花钱购买软件,SaaS只需要用户租用软件&#x…

企业应要求SaaS云服务商提供的三类安全措施

2019独角兽企业重金招聘Python工程师标准>>> 在面临SaaS云服务应用中的安全性问题时,密码管理不当和不安全协议威胁都将会对您的系统保密造成破坏或数据泄露,同时可能需要由您的企业来承担法 律责任。在本文中,我们将探讨SaaS所带…

SaaS-多租户SaaS平台的数据库方案(数据库设计与建模)

2 数据库设计与建模 2.1 数据库设计的三范式 三范式: 第一范式(1NF):确保每一列的原子性(做到每列不可拆分)第二范式(2NF):在第一范式的基础上,非主字段必…

删库跑路事件发生,SaaS 云服务如何守护数据安全?

作者 | 蒋敏峰 责编 | Carol 封图 | CSDN付费下载于视觉中国 近日,某SaaS服务商/微盟遭遇员工删库跑路,服务器出现大面积故障,一时间让平台上的几百万家商户生意基本停摆。这一事件发生后,不管是厂商还是平台上的用户,…

SaaS、 PaaS和IaaS,云计算三种服务模式的区别

1. SaaS:Software-as-a-Service(软件即服务) 提供给客户的服务是运营商运行在云计算基础设施上的应用程序,用户可以在各种设备上通过客户端界面访问,如浏览器。消费者不需要管理或控制任何云计算基础设施,…

云计算的三种服务模式:IaaS、PaaS和SaaS

一、IaaS、PaaS、SaaS简介 基础设施即服务 (IaaS): Infrastructure as a Service 基础设施即服务有时缩写为 IaaS,包含云 IT 的基本构建块,通常提供对联网功能、计算机(虚拟或专用硬件)以及数据存储空间的访问。基础…

IaaS、PaaS、SaaS、DaaS——各种云服务模式一览

导读:本文将详细科普云计算的概念、云服务的发展现状,并逐一介绍各种云服务模式(IaaS、PaaS、SaaS、DaaS),建议收藏! 01 云计算的概念 云是一种服务,可以像使用水、电、煤那样按需使用、灵活付…

SaaS云服务应用的访问安全性分析

2019独角兽企业重金招聘Python工程师标准>>> 越来越多的组织转向了软件即服务(SaaS云服务),把它做为解决企业需求的一种方法,而不必承担管理和维护应用的负担。作为SaaS云服务的用户,你必 须得到供应商的保…

把移动和社交融入SaaS云服务

2019独角兽企业重金招聘Python工程师标准>>> 把移动和社交融入SaaS云服务 中小企业呼唤更加简单、实用、灵活并能为员工提供直接价值的新型软件服务,然而仅仅靠将传统软件搬上互联网,远不能满足中小企业信息化需求。管理软件本身必须改变…

IaaS,PaaS,Saas 云服务的介绍

云服务只是一个统称,可以分成三大类。 IaaS:基础设施服务,Infrastructure-as-a-servicePaaS:平台服务,Platform-as-a-serviceSaaS:软件服务,Software-as-a-service 从左到右,自己承担…

删库跑路事件发生,SaaS云服务如何守护数据安全

作者 | 蒋敏峰 责编 | Carol 封图 | CSDN付费下载于视觉中国 近日,某SaaS服务商/微盟遭遇员工删库跑路,服务器出现大面积故障,一时间让平台上的几百万家商户生意基本停摆。这一事件发生后,不管是厂商还是平台上的用户,…

为什么很多企业要自研CRM系统,而不够买SAAS云服务提供的CRM系统或SCRM系统?...

很多企业要自研CRM系统,而不够买SAAS云服务提供的CRM系统或SCRM系统最主要的适用性的问题,标准化的产品与企业个性化需求产生了矛盾导致了很多企业在系统推广使用中产生诸多问题。SAAS云服务提供的CRM系统或SCRM系统都是标准化的产品,在给企业…

瑞云、Bentley、瞰融达成战略合作,共创实景三维建模SaaS云服务新未来

8月25日,深圳市瑞云科技有限公司(简称”瑞云”)、Bentley软件(北京)有限公司(简称”Bentley软件”)、上海瞰融信息技术发展有限公司(简称”瞰融”)成功签署战略合作协议&…

聚焦低代码SaaS云服务,让企业轻松办公!

我们在发展史中总是在做着选择题,从直立行走,到突破5G;从传统IT咨询到SaaS化服务,一步之遥,又遥若云汉。 一边是封闭的内向管理系统,一边是生态开放的互联互通平台; 一边是固化的传统开发定制,一边是化为绕指柔的灵活配置与迭代; 一边是由内到外的繁杂部署,一边是全…

IaaS PaaS SaaS云服务三种应用模式

前言 本人之前针对IaaS类型云服务的Openstack做出了较长时间的调研,无论是应用层面还是源码级别的层面,过程极其坎坷,而且并没有觉得找到了云计算的核心思想。现在将其分享出来,希望能够与大家共同探讨。 云计算是一种基于互联网、…

IDC中国大型企业SaaS云服务市场:金蝶位居第一

近日,《IDC中国EA SaaS 公有云服务市场跟踪报告(2021年上半年)》显示,金蝶在大、中、小型企业SaaS ERM(企业资源管理云服务)市场占有率均斩获第一。这是金蝶自云转型以来首次在大型企业市场摘得桂冠&#x…

【云计算学习教程】IaaS、PaaS和SaaS:云计算的三种服务模式(精讲)

文章目录 云计算IaaS服务模式精讲第一层(云管理器)第二层(集群管理器)第三层(计算机管理器) 云计算PaaS服务模式精讲1)半平台 PaaS2)全平台 PaaS 云计算SaaS服务模式精讲适合做 SaaS…