首页 > 其他分享 >前端开发必备Vs Code插件大全(2024最新)赶快收藏吧~

前端开发必备Vs Code插件大全(2024最新)赶快收藏吧~

时间:2024-10-25 15:20:10浏览次数:10  
标签:插件 Code 鼠标 Auto 代码 2024 Tag Vue

1、装上这个 Chinese (Simplified) 就变成中文版的啦~

在这里插入图片描述

2、GitLens — Git supercharged (上班族必备)
git 功能增强插件,鼠标放到代码行上,每一行代码的变动都一清二楚~

在这里插入图片描述
在这里插入图片描述

3、Git History :可以查看提交历史,切换分支,查看提交记录等

在这里插入图片描述
在这里插入图片描述

4、Auto Import、Auto Close Tag、Auto Rename Tag

  • Auto Import可以根据你引入的组件,自动导入提示;
  • Auto Rename Tag当你修改标签的时候,自动完成另一侧标签的同步修改;
  • Auto Close Tag 自动出现HTML/XML闭合标签

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

5、Color Highlight :显示所添加的颜色; Color Picker:鼠标悬浮在颜色上可以出现颜色板,可以自行选择颜色

在这里插入图片描述
在这里插入图片描述
例如:
在这里插入图片描述

在这里插入图片描述

6、CSS Peek :鼠标点击class名上会跳到下方对应的style样式

在这里插入图片描述

7、Path Intellisense:自动提示文件路径,支持各种快速引入文件

在这里插入图片描述

8、Image preview
图片是否正确引入的显示工具,在图片连接上按住ctrl,鼠标悬浮即可看见是否正确找到路径下的图片文件

![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/cfac08b333f546e684914f8a1a377647.png
在这里插入图片描述

9、ESLint:校验我们的代码规范

在这里插入图片描述

10、Live Server
开启本地服务器,安装后,可以直接浏览器访问html页面。

在这里插入图片描述

11、JavaScript(ES6) code snippets
ES6语法智能提示,以及快速输入,不仅仅支持.js,还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间

在这里插入图片描述

12、Prettier:代码格式化

在这里插入图片描述

13、Vetur
Vue多功能集成插件,包括:语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。Vue开发者必备。

在这里插入图片描述

14、Vue VSCode Snippets
非常推荐 可以构建代码片段的缩写,大大节约开发时间,把时间花在逻辑上而不是繁琐的模板语法上

在这里插入图片描述

15、Vue 3 Snippets
提供了针对Vue 3的代码片段,包括Composition API等新特性的代码片段,帮助开发者快速编写Vue 3代码。

在这里插入图片描述

16、open in browser
可让你的html文件在浏览器中打开

在这里插入图片描述

17、CodeSnap
选中需要截取的代码块,然后右键点击 CodeSnap 即可生成截图

在这里插入图片描述

18、element-plus-doc
element-plus 的一个工具插件,用于智能提示,悬停显示文档等

在这里插入图片描述

19、Error Lens

通过高亮整行代码并内联显示诊断信息,使得开发者能够更快速地发现和修复代码中的问题

在这里插入图片描述

20、Power Mode:一款敲代码有暴击炫酷效果

在这里插入图片描述
在这里插入图片描述
输入即可有效果,你就是全组最亮的仔~
在这里插入图片描述

21、Thief-Book :摸鱼看书神器

在这里插入图片描述
输入下载到本地的小说路径即可,仅支持TXT格式
在这里插入图片描述
注意:鼠标要聚焦按下面快捷键
在这里插入图片描述
在这里插入图片描述

22、小霸王 :支持几十款游戏,实乃上班娱乐摸鱼的必备插件!

在这里插入图片描述
在这里插入图片描述


持续更新,如有建议请留言~

标签:插件,Code,鼠标,Auto,代码,2024,Tag,Vue
From: https://blog.csdn.net/weixin_74149305/article/details/143177722

相关文章

  • 2024年Stable Diffusion安装教程(附安装包链接)
    随着技术的迭代,目前StableDiffusion已经能够生成非常艺术化的图片了,完全有赶超人类的架势,已经有不少工作被这类服务替代,比如制作一个logo图片,画一张虚拟老婆照片,画质堪比相机。今天直接给大家上干货,安装包链接在最后!!!安装步骤1.打开链接,可以看到这里边为大家提供了......
  • 【重磅】第二届大数据与数据挖掘国际会议(BDDM 2024)新增大会主讲
    第二届大数据与数据挖掘国际会议(BDDM2024)近日有幸邀请到中国人民大学高瓴人工智能学院长聘副教授、博导严睿加入,担任大会主讲嘉宾,欢迎同研究领域的专家学者前来参会交流。严睿,中国人民大学高瓴人工智能学院长聘副教授、博导,获国家优秀青年科学基金资助。博士毕业于北京大学......
  • 2024最新4.2版本社交圈子系统小程序上传审核失败处理方法,全开源社交圈子论坛系统源码
    小程序审核被退回问题处理办法一、新版用户提交小程序审核时被退回原因是源码下载地址:https://gitee.com/dkkyrj/dkquanzi处理办法:请下载此文件覆盖重新打包上传即可,这里把用户修改资料改为了小程序平台不显示填写,H5和app保留。下载后解压覆盖到前端文件/minePag......
  • VS Code 配置 C/C++ 开发环境
     一、下载编译工具MinGWgithub上的版本更新较快github 配置系统环境,并验证 二、VSCode 1、VSCode 安装C/C++相关扩展2.VSCode添加编译器、并运行调试Ctrl+Shift+p 进入C/C++编辑配置,修改编译器目录 运行1.cpp 执行 ......
  • make编译时fatal error: codecvt: No such file or directory解决方法
    用cmake在centos7中编译c++编译报错,信息如下fatalerror:codecvt:Nosuchfileordirectorycodecvt为c++标准库头文件(示例代码),其起到封装字符串的转换,包括宽和多字节,从一种编码到另一种的作用。最初从一些帖子上看到,codecvt库只有C++11标准及以上才支持,需要在编译时gcc后添上......
  • 20222326 2024-2025-1 《网络与系统攻防技术》实验三实验报告
    1.实验内容实验具体内容正确使用msf编码器,veil-evasion,自己利用shellcode编程等免杀工具或技巧正确使用msf编码器,使用msfvenom生成如jar之类的其他文件veil,加壳工具使用C+shellcode编程通过组合应用各种技术实现恶意代码免杀用另一电脑实测,在杀软开启的情况下,可......
  • 2024年运动场划线机市场发展战略研究报告
    运动场划线机是一种专门用于在体育场地划线的专业设备。这些机器可以用于足球场、篮球场、网球场、田径场等多种体育场所,以确保场地线条清晰、准确,符合比赛规则。2024年10月恒州诚思(YHResearch)调研团队最新发布的《2024年全球及中国运动场划线机行业头部企业市场占有率及排名调研报......
  • 2024年内部知识库软件市场发展战略研究报告-恒州诚思
    内部知识库是一个私有的、内部使用的知识管理平台,它允许企业员工轻松地查找、访问、共享和管理公司内部的各种知识资源。这些资源可能包括公司政策、流程文档、培训材料、项目文档、常见问题解答(FAQs)、最佳实践、工作流程模板、关键人员联系方式、会议记录和议程、软件工具文档等。......
  • 2024-10-23-leetcode每日一题-构成整天的下标对数目 II
    题目描述给你一个整数数组 hours,表示以 小时 为单位的时间,返回一个整数,表示满足 i<j 且 hours[i]+hours[j] 构成 整天 的下标对 i, j 的数目。整天 定义为时间持续时间是24小时的 整数倍 。例如,1天是24小时,2天是48小时,3天是72小时,以此类推。......
  • 2024年最新婚恋交友系统源码,闪亮登场!支持微信小程序+微信公众号+H5+APP
    在快节奏的现代生活里,大家忙得像陀螺,一不小心就把感情生活晾在了一边。找另一半?既让人期待,又让人头疼。这时候,红娘婚恋相亲交友系统闪亮登场,成了婚恋市场上的“暖宝宝”。一、介绍系统基于TP6+Uni-app框架开发;客户移动端采用uni-app开发,管理后台TH6开发。系统支持微信公......