vscode中 vue3+ts 项目的提示失效,volar插件失效问题解决方案

news2024/10/2 14:38:09

文章目录

  • 前情提要
  • bug回顾
  • 解决方案
  • 最后

前情提要

在这里插入图片描述
说起来很耻辱,从mac环境换到window环境,vscode的配置都是云端更新过来的,应该是一切正常才对,奇怪的是我的项目环境出现问题了,关于组件的ts和追踪都没有效果,再经过一上午的排查和试错后,终于被我解决,问题的原因是volar和ts环境之间的版本不匹配,下面来看下我的解决过程和问题复现。


bug回顾

大家的插件库里应该都有一个这样的插件
在这里插入图片描述
这是一个增强我们ts开发体验的插件,有了它之后我们的开发会很有乐趣,比如,我们自定义了一个组件,那么它里面有哪些参数,该插件就会帮我们提示,例子如下:
在这里插入图片描述
尤其是使用一些三方组件的时候,很多属性是未知的,所以这样的提示必不可少。那么我的问题就是没有这些提示和组件高亮追踪了,如下所示:

在这里插入图片描述
可以看到标签高亮也没有,属性提示更是不存在


解决方案

前面提到,我调研到是Volar和TS的版本问题,所以,我们要切换Volar插件的Ts版本

ctrl+shift+p 出现命令板,输入如下命令并点击:>Volar:select Type

在这里插入图片描述
出现下面这个选项后,可以看到,当前vscodes的 ts 版本是5.4,而项目依赖的是4.82,所以切到项目依赖的版本上去,我们的Volar就可以重新使用了。
在这里插入图片描述


最后

📚 Typescript
☃️ 个人简介:一个喜爱技术的人。
🌞 励志格言: 脚踏实地,虚心学习。
❗如果文章还可以,记得用你可爱的小手点赞👍关注✅,我会在第一时间回、回访,欢迎进一步交流。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1180207.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Ansible入门—安装部署及各个模块应用案例(超详细)

目录 前言 一、环境概况 修改主机名(可选项) 二、安装部署 1.安装epel扩展源 2.安装Ansible 3.修改Ansible的hosts文件 4.生成密钥 三、Ansible模块使用介绍 Command模块 Shell模块 User模块 Copy模块 File模块 Hostname模块 Yum模块 Se…

企业数字展厅该如何设计?

设计企业数字展厅涉及创建一个虚拟空间,以引人入胜的沉浸式方式展示公司的产品、服务和品牌。以下步骤可帮助设计有效的数字展厅: 1.定义目标: 确定数字展厅的用途。是为了潜在客户开发、产品展示、品牌推广还是其他目的?明确的…

LoRaWan模块应用于智慧城市景观灯

智能路灯作为一种新型的市政公用设施,它不仅具备了常规的照明能力,还具备各种智能装置和感应器,能够实现对太阳的自发充电;视频监控,环境监测等多种应用。智能路灯集成了各种新型的设备,是智慧都市的基础&a…

还在按键进入BIOS?其实进入BIOS有更便捷的方法

在能够配置各种硬件参数之前,首先必须学习进入ASUS BIOS实用程序的正确方法。无论你面对的是PRIME、ROG、TUF GAMING还是任何其他型号,所涉及的步骤都是相同的。 华硕主板的BIOS访问键通常是“F2”或“Del”键。在启动或启动屏幕期间,只要ASUS徽标出现,就重复按下此键以进…

响应式建筑地产工程企业网站模板源码带后台

模板信息: 模板编号:9157 模板编码:UTF8 模板颜色:多色 模板分类:基建、施工、地产、物业 适合行业:建筑施工类企业 模板介绍: 本模板自带eyoucms内核,无需再下载eyou系统&#xf…

nuxt项目:vant打包后样式顺序错乱问题及解决方案

不要引入vant/nuxt这个 需要的时候引入即可

C++ set 的使用

set 的介绍 set是按照一定次序存储元素的容器在set中,元素的value也标识它(value就是key,类型为T),并且每个value必须是唯一的。 set中的元素不能在容器中修改(元素总是const),但是可以从容器中插入或删除它们。在内部&#xff0…

CSS时间线样式

css实现时间线样式,效果如下图: 一、CSS代码 .timeline {padding-left: 5px} .timeline-item { position: relative;padding-bottom: 20px;} .timeline-axis {position: absolute;left: -5px;top: 0;z-index: 10;width: 20px;height: 20px;line-he…

抢购狂欢:跨境电商的区域购物节

随着全球贸易的不断扩展和数字化技术的崭新发展,跨境电商行业已经蓬勃发展,为消费者和商家带来了前所未有的便捷和机会。 其中,区域购物节已成为跨境电商领域的一大亮点,为在线消费者和电商平台提供了一个令人兴奋的购物体验。本…

在web页面音视频录制并下载到本地——MediaRecorder

音视频录制前需要获取到流,使用 navigator.mediaDevices 来完成。 navigator.mediaDevices MediaDevices 接口提供访问连接媒体输入的设备,如照相机和麦克风,以及屏幕共享等。它可以使你取得任何硬件资源的媒体数据。 简单介绍一下MediaDe…

外贸SEO前景怎么样?外贸网站优化的方法?

网站做外贸SEO的前景如何?谷歌SEO对海洋建站的影响? 外贸SEO前景一直备受关注,特别是在全球化经济的今天。随着跨境电子商务的崛起,外贸企业越来越重视搜索引擎优化来提升他们的在线可见性。顺风船将探讨外贸SEO前景的各个方面&a…

Synchronized关键字使用不合理,导致的多线程下线程阻塞问题排查

在为客户进行性能诊断调优时,碰到了一个Synchronized关键字使用不合理导致多线程下线程阻塞的情况。用文字记录下了问题的整个发现-排查-分析-优化过程,排查过程中使用了商业化产品——XLand性能分析平台,通过文章主要希望跟大家分享下分析和…

pycharm pro v2023.2.4(Python开发)

PyCharm是一种Python集成开发环境(IDE),PyCharm提供了强大的功能,包括语法突出显示、智能代码完成、代码检查、自动重构和调试等特性,这些都可以帮助Python开发人员更加高效地编写代码。 PyCharm Pro是PyCharm的高级版…

SSM整合redis及redis的注解式开发和解决Redis缓存问题

一.SSM整合Redis 1.pom配置 用于解决运行时没有将数据库配置信息jdbc.properites加载到target文件中 <resource><directory>src/main/resources</directory><includes><include>*.properties</include><include>*.xml</includ…

《巧用ChatGPT快速提高职场晋升力》书籍推荐【包邮送书五本】

文章目录 书籍介绍内容介绍ChatGPT 在人工智能助手领域的应用1 智能客服2 语音助手3 个人助手4 内容创作与编辑5 数据分析与报告生成6 社交媒体管理7 智能编程助手 抽奖送书 书籍介绍 ★超实用 通过30多个实战案例和操作技巧&#xff0c;使读者能够快速上手并灵活运用ChatGPT技…

操作系统:银行家算法

文章目录 银行家算法一、实验目的二、实验要求与内容、过程与结果 系列文章 银行家算法 一、实验目的 1、理解银行家算法。 2、掌握进程安全性检查的方法及资源分配方法。 二、实验要求与内容、过程与结果 1、将图5-1补充完整&#xff0c;画出银行家算法的流程图。 图5-1 银…

el-table给某一行加背景色

数据列表中总价大于100的一行背景色为红色&#xff0c;效果图如下&#xff1a; 代码示例&#xff1a; <template><div id"app"><!-- 测试区域&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&am…

正式发布!万应低代码入选中国信通院《2023高质量数字化转型技术解决方案集》

随着科技的快速发展和市场竞争的日益激烈&#xff0c;数字化转型已成为企业持续发展和提升竞争力的关键。然而&#xff0c;在数字化转型的过程中&#xff0c;许多企业面临着诸多痛点&#xff0c;如缺乏先进的技术与方案、难以实现数据互通和集成、无法有效提升业务效率与规模。…

Redis-----SSM整合redis及redis的注解式开发以及redis的击穿,穿透,雪崩三种解决方案

目录 SSM项目整合Redis 导入pom依赖 配置文件spring-redis.xml redis.properties 配置redis的key生成策略 redis的注解式开发及应用场景 什么是redis的注解式 redis注解式的场景应用 Cacheable 自定义策略 Cacheable可以指定三个属性&#xff0c;value、key和condition…

自制圆形时钟⏰

如果想着做一个类似的家里的圆形时钟的样式的钟表&#xff0c;可以使用这样的方法&#xff1a; #import "ViewController.h" interface ViewController () property (nonatomic,weak)CALayer *second; property (nonatomic ,weak)CALayer *minute; property (nona…