位置: IT常识 - 正文

前端vscode必备插件(强烈推荐)(前端vscode配置)

编辑:rootadmin
前端vscode必备插件(强烈推荐)

目录

一、前言

二、工具推荐

1.《Chinese (Simplified) (简体中文) Language》

2.《ESLint》

3.《Git History》

4.vscode-icons 

5.Path Intellisense

6.《Vetur》

7.《GitLens — Git supercharged》

8.《Image preview》

9.Debugger for Chrome

10.Prettier

11.AnyRule 

13.Vue Language Features (Volar)

14.Vite

15.Code Spell Checker

16.Error Lens

17.Angular Language Service。

18.Angular Files

19.《小霸王》


一、前言

推荐整理分享前端vscode必备插件(强烈推荐)(前端vscode配置),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:vscode前端使用教程,vscodeweb前端插件,前端vscode配置,vscode前端开发教程,vscode前端使用教程,vscode写前端代码要装什么插件,前端vscode必备插件,前端vscode必备插件,内容如对您有帮助,希望把文章链接给更多的朋友!

VSCode 是我们前端开发的一个强大的IDE,因此选择趁手好用的插件能事半功倍,也能能更好地编码以及获得更丝滑的开发体验。然后剩下的时间用来摸鱼是很有必要滴。

二、工具推荐1.《Chinese (Simplified) (简体中文) Language》

首先呢,我先推荐的就是最基础的语言包,没办法,英语水平太捞了哈哈哈,弄起来后就舒服多了,汉语yyds~。

2.《ESLint》

这个其实真的是又爱又恨,有时候一些写法自己觉得很舒服,他就给你提示不规范,看个人开发习惯吧哈哈哈。

3.《Git History》

查看git的分支管理、提交记录等。

4.vscode-icons 

该插件会基于文件扩展名在 the tree view 中的文件名旁添加图标,让你更容易地识别文件。

效果图如下:

 5.Path Intellisense

该扩展可以自动补全代码中的路径和文件名。例如前端的静态文件引入路径填写修改。

 

 效果图如下:

6.《Vetur》

这个vue开发者必备的扩展就不多做解释了,代码高亮,补齐等等。

7.《GitLens — Git supercharged》

git团队项目管理工具。

这个工具可以清楚的看见哪些bug是谁写的,还有很多功能,也是团队开发中必安的插件。

效果如下:

8.《Image preview》

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

效果如下:

9.Debugger for Chrome前端vscode必备插件(强烈推荐)(前端vscode配置)

映射vscode上的断点到chrome上,方便调试。

10.Prettier

Prettier 是目前 Web 开发中最受欢迎的代码格式化程序。安装了这个插件,它就能够自动应用Prettier,并将整个 JS 和 CSS 文档快速格式化为统一的代码样式。如果你还想使用 ESLint,那么还有个 Prettier – Eslint 插件,你可不要错过咯。

11.AnyRule 

这是一个用来快速检索常用正则表达式的插件,希望能给大家在繁忙的开发过程中带来一丁点的效率提升。

 

 效果图如下:

13.Vue Language Features (Volar)

相信使用 VSCode 开发 Vue2 的同学一定对 Vetur 插件不会陌生,作为 Vue2 配套的 VSCode 插件,它的主要作用是对 Vue 单文件组件提供高亮、语法支持以及语法检测。

而随着 Vue3 正式版发布,Vue 团队官方推荐 Volar 插件来代替 Vetur 插件,不仅支持 Vue3 语言高亮、语法检测,还支持 TypeScript 和基于 vue-tsc 的类型检查功能。

14.Vite

Vite 插件可以让我们打开项目后,就能自动启动开发服务器,允许开发者无需离开编辑器即可预览和调试应用。支持一键启动、构建和重启项目。

15.Code Spell Checker

Code Spell Checker 是在VSCode中的一款插件,能够帮助我们检查单词拼写是否出现错误,检查的规则遵循 camelCase (驼峰拼写法)。

16.Error Lens

可以将代码中不符合规范或者逻辑不通顺的错误提示信息展示在代码行内 。

 

 效果图如下:

17.Angular Language Service。

超好用的从模板 html F12一键定位变量定义位置.。

18.Angular Files

使用angular框架开发项目的同学,可以安装一键生成angular需要的文件。

19.《小霸王》

在线支持几十款游戏,实乃上班娱乐摸鱼的必备插件!!!!!

上有超级玛丽下有坦克大战 开箱即用 点开即玩 可放大放小 娱乐无穷!!!!

就先介绍这几款常用的插件,让大家更好地编码和获得更丝滑的开发体验。也欢迎各位朋友补充推荐哈。

如果文章对你有所帮助,❤️关注+点赞❤️鼓励一下!博主会持续更新。。。。

来源于:程序员摸鱼导航

本文链接地址:https://www.jiuchutong.com/zhishi/293069.html 转载请保留说明!

上一篇:如何免费使用ChatGPT进行学术润色?你需要这些指令...(如何免费使用超级简历)

下一篇:浏览器:跨域及解决方法(前端解决浏览器跨域问题)

  • 拼多多怎么删除银行卡绑定呢(拼多多怎么删除评价)

    拼多多怎么删除银行卡绑定呢(拼多多怎么删除评价)

  • 苹果7怎么设置门禁卡(苹果7怎么设置悬浮球的功能)

    苹果7怎么设置门禁卡(苹果7怎么设置悬浮球的功能)

  • 飞猪一直退票受理中怎么办(飞猪退票一直不处理)

    飞猪一直退票受理中怎么办(飞猪退票一直不处理)

  • 华为手机桌面向右偏一边(华为手机桌面向右偏移)

    华为手机桌面向右偏一边(华为手机桌面向右偏移)

  • 入驻阿里巴巴需要什么条件(入驻阿里巴巴需要囤货吗)

    入驻阿里巴巴需要什么条件(入驻阿里巴巴需要囤货吗)

  • 路由器多长时间换一个(路由器多长时间重启一次比较好)

    路由器多长时间换一个(路由器多长时间重启一次比较好)

  • word文档红色波浪线什么意思(word文档红色波浪线和蓝色波浪线)

    word文档红色波浪线什么意思(word文档红色波浪线和蓝色波浪线)

  • 网易云音乐怎么k歌(网易云音乐怎么设置桌面歌词)

    网易云音乐怎么k歌(网易云音乐怎么设置桌面歌词)

  • 抖音卸载后是什么状态(抖音卸载后是什么感受)

    抖音卸载后是什么状态(抖音卸载后是什么感受)

  • 2个人怎么建群(两个人怎么建)

    2个人怎么建群(两个人怎么建)

  • 移动4g卡怎么升5g(移动4g如何升级5 g)

    移动4g卡怎么升5g(移动4g如何升级5 g)

  • 安装包损坏该怎样修复(安装包损坏该怎么解决)

    安装包损坏该怎样修复(安装包损坏该怎么解决)

  • freelace支持苹果吗(freelacepro苹果能用吗)

    freelace支持苹果吗(freelacepro苹果能用吗)

  • 小米手机突然不计步(小米手机突然不支持快充了怎么办)

    小米手机突然不计步(小米手机突然不支持快充了怎么办)

  • 安卓手机怎么打开wim文件(安卓手机怎么打开OTG功能)

    安卓手机怎么打开wim文件(安卓手机怎么打开OTG功能)

  • beats固件升级有什么用(更新beats固件)

    beats固件升级有什么用(更新beats固件)

  • 域名地址和ip地址转换的系统是(域名地址和ip地址转换的协议)

    域名地址和ip地址转换的系统是(域名地址和ip地址转换的协议)

  • oppo怎么安装小爱同学(oppo怎么安装小黄鸟证书)

    oppo怎么安装小爱同学(oppo怎么安装小黄鸟证书)

  • wps2019智能工具箱在哪(wps2016智能工具箱在哪)

    wps2019智能工具箱在哪(wps2016智能工具箱在哪)

  • 高分屏和普通屏区别(高分屏好吗)

    高分屏和普通屏区别(高分屏好吗)

  • 美团外卖怎么两人拼单(美团外卖怎么两个人一起点)

    美团外卖怎么两人拼单(美团外卖怎么两个人一起点)

  • 什么食物含胆固醇多(什么食物含胆固醇高不能吃)

    什么食物含胆固醇多(什么食物含胆固醇高不能吃)

  • 山茶花的养殖方法(山茶花的养殖方法和注意事项视频)

    山茶花的养殖方法(山茶花的养殖方法和注意事项视频)

  • gdal概览(gdal官方文档)

    gdal概览(gdal官方文档)

  • 【前端】vue模板语法知识了解一下,是不是只知道用element-ui组件?(vue前端项目实战)

    【前端】vue模板语法知识了解一下,是不是只知道用element-ui组件?(vue前端项目实战)

  • DEDECMS实现“文章标题-栏目名称-网站名”(dedecms配置)

    DEDECMS实现“文章标题-栏目名称-网站名”(dedecms配置)

  • 销售净收入咋算
  • 公司贷款可以转私人吗
  • 稽查查补的税款用什么时候的税率表示
  • 集装箱维护是做什么的
  • 银行现金增加会计分录
  • 需要冲红的普通发票无法收回怎么办
  • 缴纳社保的基数是什么意思
  • 所得税纳税申报表在哪里打印
  • 物业公司临时工的工资可以进成本吗
  • 工会专户收到职工福利经费会计处理怎么做?
  • 收到别的公司的转账支票
  • 公司新装宽带怎么做账?
  • 过期未认证的进项税如何记账
  • 地税局返的个人所得税手续费多久返还?
  • 商业保险可以报税吗
  • 公司未分配利润太大,怎么处理好
  • 出口退免税是什么意思
  • 增值税税控盘服务费可以每年都抵扣吗
  • 发票盖章盖成了财务章有影响吗
  • 福利费的支付范围
  • 在线测网速准吗
  • 应收应付款有零头怎么处理
  • 出差人员餐费,进项可以抵扣吗
  • win10如何关闭更新并关机
  • 交易性金融资产包括哪些项目
  • windows 10月更新
  • 核定征收怎么申报个人经营所得
  • linix unix
  • 市面最高版本
  • php import
  • 应收款余额在借方什么意思
  • php解析配置文件
  • 纳汉双语
  • php 遍历字符串
  • 使用session的步骤
  • yolov5 output
  • 对方开具红字发票,我方怎么查询
  • 培训费用是什么成本
  • 公司法关于公司变更后权利义务的规定
  • wordpress账号密码忘记了
  • mysql 连接语句
  • 营改增后材料价差调整
  • 网银数字证书年费
  • 股票手续费如何计算公式
  • 应付劳务费怎么做账
  • 个人出租不动产增值税优惠政策
  • 特许权使用费收入按照收到特许权使用费的日期确认收入
  • 房租没有发票如何处理
  • 其他收益会计科目解释
  • 私人借款条怎么写合法
  • 现金日记账和银行日记账必须逐月结出余额
  • 支出未取得发票
  • 折旧年限的最新规定2021
  • 会计处理是会计分录吗
  • sqlserver 断开数据库连接
  • win10下mysql 5.7.17 zip压缩包版安装教程
  • 电脑出现蓝屏后黑屏怎么办
  • win7 word
  • 图片缩略图是什么意思
  • qqpcrtp.exe是什么进程 如何删除qqpcrtp进程
  • grub4dos linux
  • 64位win7安装kb3038314补丁更新失败临时解决方法
  • linux系统问题汇总
  • windows7文件操作步骤
  • cocos2dx4.0教程
  • 好看的css样式代码
  • nodejs爬虫框架crawler
  • golang 和 python
  • json对象转化为list
  • jQuery同步提交示例代码
  • vue实战案例
  • javascript异步编程
  • EasyTouch Broadcast messages选项在js和c#下的用法
  • jQuery 获取跨域XML(RSS)数据的相关总结分析
  • 增值税月报怎么报
  • 国家税务局扬州
  • 中国税务社保缴费app下载
  • 纳服的拼音
  • 2021北京餐饮业发展趋势报告
  • 2020年国税和地税怎么申报
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设