vue2+webpack升级vue3+vite,报错Cannot read properties of null (reading ‘isCE‘)

同学们可以私信我加入学习群!


正文开始

  • 前言
  • 问题
  • 分析
  • 解决
  • 总结


前言

系列文章:vue2+webpack升级vue3+vite,修改插件兼容性bug

前面的文章主要是介绍,在升级初始阶段遇到的一些显而易见的兼容性问题和bug。随着项目迭代的不断深入,一些不容易暴露的问题也渐渐呈现。

本文主要记录一些开发重构过程中的bug


问题

vue报错Cannot read properties of null (reading ‘isCE’)

分析

项目中vue版本出现冲突,可能是项目基础的vue版本与组件库中某个组件依赖的vue版本有冲突。但是我怀疑这只是表象,因为如果存在版本冲突,那么第一天就存在,为什么后面才暴露。而且使用npm列出所有vue版本发现并没有冲突的版本。所以最终虽然解决了,但是总觉得还是不太清楚。

解决

  1. 命令行中输入
npm ls vue

可以查看所有vue的版本,如图:
在这里插入图片描述
如果各位使用脚手架创建的项目,vue的版本会设置‘^’符号,例如我的设置为:

 "vue": "^3.3.4",

大家可以看到package.json中设置的版本号与实际项目中依赖的vue版本并不完全相同,这是因为^符号的含义就是保持大版本不变,可以根据兼容性等实际情况,升级小版本,所以 ’ ^3.3.4’的真实含义是3.3.4及以上版本,这样其实很难真的出现vue版本冲突的情况。通过上面的图片也可以知道,我的所有插件都是依赖于3.3.6。

实际情况确实是报错vue版本冲突,所以我只能认为可能是因为别的原因导致了这个报错,也就是其实报错信息就有问题。我没有想到其他方法严谨地定位到问题,只能把可以做的都做了一遍。

  1. 升级node

看一下自己的node版本,vue2在16版本的node中运行毫无问题,vue3在部分16版本的node中也无太大问题,但是总会出现预料不到的风险,甚至升级某些插件时也会提示node版本过低。vue官网也推荐18版本以上node:
在这里插入图片描述
所以为了省事,还是直接升级node吧。

这里有个问题,那就是18版本的node可能运行vue2时会报错,所以如果是升级vue,可能会有一段时间,既开发vue2,又重构vue3,我们就需要一个很方便的node版本管理工具,推荐nvm。我自己写的基于nvm的可视化工具也快要完成了,基本功能已经实现,还达不到生产标准。

大家可以提前关注一波,等几个重要的工具同时开发完毕,会免费发布并群发消息提醒。如图:
在这里插入图片描述

  1. 虽然大概率不是vue版本的问题,但是为了以防万一,还是对vue版本做一个强制限制吧,在vite中配置参数dedupe,解决vue版本依赖冲突问题:
 resolve: {dedupe: ['vue'],},
  1. 如果这些还是无法解决,那就先清楚npm的缓存:
npm cache clean --force

删除node_modules后,重新更新资源,运行项目。


总结

博主的大部分文章都是有价值的原创文章,很少搬运点官方文档就水一篇,大家如果认可,希望多多点赞关注,原创不易,需要支持。

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

从数据角度分析年龄与NBA球员赛场表现的关系【数据分析项目分享】

好久不见朋友们,今天给大家分享一个我自己很感兴趣的话题分析——NBA球员表现跟年龄关系到底大不大?数据来源于Kaggle,感兴趣的朋友可以点赞评论留言,我会将数据同代码一起发送给你。 目录 NBA球员表现的探索性数据分析导入Python…

mysql中的联合索引为什么要遵循最佳左前缀法则?

mysql中的联合索引为什么要遵循最佳左前缀法则? 一、什么是联合索引二、联合索引的优化1.常规的写法(回表查询)2.优化写法(索引覆盖) 三、 为什么要遵循最佳左前缀法则?1.如下查询语句可以使用到索引&#…

100天精通鸿蒙从入门到跳槽——第8天:TypeScript 知识储备:泛型

博主猫头虎的技术世界 🌟 欢迎来到猫头虎的博客 — 探索技术的无限可能! 专栏链接: 🔗 精选专栏: 《面试题大全》 — 面试准备的宝典!《IDEA开发秘籍》 — 提升你的IDEA技能!《100天精通Golang》…

k8s---配置资源管理

目录 配置资源管理的方式 secret pod如何来引用secret??? 陈述式创建: 声明式创建 Secret创建加密文件 使用token挂载 环境变量使用 docker-registry ConfigMap 陈述式 热更新 总结: 配置资源管理的方式 …

开发知识点-JAVA-springboot

springboot springbootConfiguration注解的底层核心原理Bean注解的底层核心原理 springboot Configuration注解的底层核心原理 https://www.bilibili.com/video/BV1rq4y1E7gK/?spm_id_from333.999.0.0&vd_sourcef21773b7086456ae21a58a6cc59023be spring.io 全家桶 24…

ETL概念

ETL ETLELT 技术原理ETL 模式应用场景常见工具ETL未来发展方向 ETL 在BI项目中ETL会花掉整个项目至少1/3的时间, ETL设计的好坏直接关接到BI项目的成败。ETL(Extract-Transform-Load) : 用来描述将数据从来源端经过抽取(extract)、转换&…

怎么解决离散型制造业中的7大浪费

企业在生产管理中会产生各种浪费,MES可以巧妙结合精益化生产管理思想消除这些浪费。离散制造中的7大浪费: 1、生产不良 生产过程中出现废品、次品这类质量问题,一方面会消耗原材料、零部件等,另一方面生产、返修过程也会消耗人工…

SpringBoot+dynamic-datasource实现多数据源(msyql、sqlserver、postgresql)手动切换

场景 SpringBootMybatisPlusdynamic-datasources实现连接Postgresql和mysql多数据源: SpringBootMybatisPlusdynamic-datasources实现连接Postgresql和mysql多数据源-CSDN博客 上面实现通过注解和配置文件的方式去进行多数据源操作。 如果业务需求,比…

第一篇【传奇开心果系列】beeware开发移动应用:轮盘抽奖移动应用

系列博文目录 beeware开发移动应用示例系列博文目录一、项目目标二、开发传奇开心果轮盘抽奖安卓应用编程思路三、传奇开心果轮盘抽奖安卓应用示例代码四、补充抽奖逻辑实现五、开发传奇开心果轮盘抽奖苹果手机应用编程思路六、开发传奇开心果轮盘抽奖苹果手机应用示例代码七、…

linux java 8安装

tar -zxf jdk-8u***.tar.gz -C /usr/loacl/ vim /etc/profile i 输入 export JAVA_HOME/usr/local/安装文件名 export PATH${JAVA_HOME}/bin:$PATH ESC :wq 保存退出 source /etc/profile 验证 java -version

【论文阅读】ControlNet、文章作者 github 上的 discussions

文章目录 IntroductionMethodControlNetControlNet for Text-to-Image DiffusionTrainingInference Experiments消融实验定量分析 在作者 github 上的一些讨论消融实验更进一步的探索Precomputed ControlNet 加快模型推理迁移控制能力到其他 SD1.X 模型上其他 Introduction 提…

AWTK 开源串口屏开发(7) - 屏幕保护

现代屏幕其实并不需要屏幕保护,不过屏幕保护程序会衍生一些其它用途。比如: 保护隐私。长时间不操作,通过动画或者其它方式隐藏屏幕内容。数据安全。长时间不操作,需要输入密码才能恢复。美观/广告。长时间不操作,显示…