vue3 项目启动时vite版本问题报错

背景:

我是在项目迁移过程中遇到的这个问题,前提可以看下面这篇

http://t.csdnimg.cn/g70Eq


问题描述

迁移项目时,将项目整体升级到了vue3版本,启动项目时出现下列报错:

npm ERR! Found: vite@5.1.4 
npm ERR! node_modules/vite 
npm ERR! dev vite@"^5.0.10" from the root project 
npm ERR! npm ERR! Could not resolve dependency: 
npm ERR! peer vite@"^3.0.0" from @vitejs/plugin-legacy@2.3.1 
npm ERR! node_modules/@vitejs/plugin-legacy 
npm ERR! dev @vitejs/plugin-legacy@"^2.2.0" from the root project 
npm ERR! npm ERR! Fix the upstream dependency conflict, or retry 
npm ERR! this command with --force or --legacy-peer-deps 
npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! 
npm ERR! 
npm ERR! For a full report see: 
npm ERR! C:\Users\tmed-\AppData\Local\npm-cache\_logs\2024-02-29T07_42_24_927Z-eresolve-report.txt npm ERR! A complete log of this run can be found in: C:\Users\tmed-\AppData\Local\npm-cache\_logs\2024-02-29T07_42_24_927Z-debug-0.log

错误分析:

这个错误是由于依赖版本之间的冲突导致的。具体地说,你的项目中同时存在两个依赖项,它们对 Vite 的版本有不同的要求,从而导致了冲突。

错误信息中提到了两个依赖项:

  1. 你的项目中使用的 vite 版本是 5.1.4。
  2. 一个名为 @vitejs/plugin-legacy 的插件,它要求 vite 的版本在 3.0.0 以上。

解决这个问题的方法有几种:

  1. 更新插件版本:尝试更新 @vitejs/plugin-legacy 插件的版本,使其与当前使用的 vite 版本兼容。你可以查看该插件的最新版本,然后在你的项目中更新到兼容的版本。

  2. 降级 vite 版本:如果你的项目中可以接受使用 vite 的较低版本,可以尝试降级 vite 到与 @vitejs/plugin-legacy 兼容的版本。你可以在 package.json 文件中将 vite 的版本号修改为与插件要求的版本相匹配的版本。

  3. 使用 --force 或 --legacy-peer-deps 选项:在运行 npm install 命令时,可以尝试添加 --force 或 --legacy-peer-deps 选项来强制解决依赖冲突。但是这种方法可能会导致依赖关系不一致,潜在地引入问题,因此应谨慎使用。

尝试上述方法中的一种,以解决依赖冲突问题。完成后,重新运行 npm install 命令。如果问题仍然存在,请检查 npm 日志文件,以获取更多详细信息,并尝试根据日志文件中的信息进一步解决问题。


解决方案

升级版本

查看vite的版本:GitHub - vitejs/vite: Next generation frontend tooling. It's fast!

 也可以去官网查看vite的插件:

Plugins | Vite

可以看出最新版本都是5.X,所以如果node支持的话可以直接升级到5,那么大概率能解决这样的问题。

我的vite版本之前是5.1.14,node的版本是>20,所以这里我试着更新了几个插件版本,降级vite的版本,都不兼容,会报下面的错误:

 

等等,上面的报错很多,大多是插件和vite版本之间不兼容。

于是我去搜索vite和其插件的兼容版本 ,无果,在翻看vite的更新日志的时候看见,这里:

地址是:https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md 

既然vite5进行了大升级,其他几个插件又都有新版本,甚至都是5版本,那么我就想升级到新版本,于是开始升级。

升级前和升级后的版本信息:

 我是先确定vite的版本,然后将其他几个插件的版本都写成最新的,如果有不兼容则相应的改版本。

这个问题就解决了。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2024-2.基础操作-Python

Jupiter基本使用 cell有两种模式: codemarkdown 快捷键 新建cell:a,b删除cell:dd,x运行cell:shiftenter切换cell模式: m:将code模式的cell切换到mdy:将md模式的cell切换到code 智能补全&#x…

QT Webengine开发过程报错qml: Render process exited with code 159 (killed)

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、解决方法二、补充说明总结 前言 提示:这里可以添加本文要记录的大概内容: 基于QT的Webengine开发过程中,QT的官方示例…

【算法】反转链表

本题来源---《反转链表》 题目描述: 给你单链表的头节点 head ,请你反转链表,并返回反转后的链表。 示例 1: 输入:head [1,2,3,4,5] 输出:[5,4,3,2,1]示例 2: 输入:head [1,2] 输…

22长安杯电子取证复现(检材一,二)

检材一 先用VC容器挂载,拿到完整的检材 从检材一入手,火眼创建案件,打开检材一 1.检材1的SHA256值为 计算SHA256值,直接用火眼计算哈希计算 9E48BB2CAE5C1D93BAF572E3646D2ECD26080B70413DC7DC4131F88289F49E34 2.分析检材1&am…

50.HarmonyOS鸿蒙系统 App(ArkUI)web组件实现简易浏览器

50.HarmonyOS鸿蒙系统 App(ArkUI)web组件实现简易浏览器 配置网络访问权限: 跳转任务: Button(转到).onClick(() > {try {// 点击按钮时,通过loadUrl,跳转到www.example1.comthis.webviewController.loadUrl(this.get_url);} …

Root mapping definition has unsupported parameters: [all : {analyzer=ik_max_wor

你们好,我是金金金。 场景 我正在使用Springboot整合elasticsearch,在创建索引(分词器) 运行报错,如下 排查 排查之前我先贴一下代码 import org.elasticsearch.action.admin.indices.create.CreateIndexRequest; // 注意这个包SpringBootTe…

Linux中如何安装ImageMagick及其常规使用命令

在Linux中安装ImageMagick可以通过包管理工具进行安装。具体步骤如下: 打开终端(Terminal)。 使用以下命令更新系统软件包列表: sudo apt update使用以下命令安装ImageMagick: sudo apt install imagemagick安装完…

物理机安装centos7并配置基本环境,网络配置,docker配置

1.首先下载镜像Download 2.下载UltraISO 安装docker 第1步:卸载当前版本docker yum erase docker \docker-client \docker-client-latest \docker-common \docker-latest \docker-latest-logrotate \docker-logrotate \docker-selinux \docker-engine-selinux \do…

[生活][杂项] 如何正确打开编织袋

编织袋打开的正确姿势 面对单线分离右边的线头,然后依次拉开即可

YAML教程-1-基础入门

领取资料,咨询答疑,请➕wei: June__Go YAML简介 YAML(YAML Aint Markup Language)是一种用于数据序列化的人类可读格式。它广泛用于配置文件、数据交换、持续集成/持续部署(CI/CD)等领域。YAML的设计目标…

注意,把Python库安装在一个环境里,可能会“非常危险”!

如果说谁写Python不用第三方库,我敬他是条汉子。如今到处是轮子的时代,Python第三方库管理成了开发者们头疼的问题。 可能在看这篇文章的很多人,都没用过Python虚拟环境,不知道安装Python库需要考虑版本兼容问题。 那么把所有要…

基于SpringBoot的健身房管理系统

一.前言 本系统用了 Sping Data JPA 这一不常用的数据库框架,是一个值得学习研究的点。 本项目用户名:admin 密码: admin123 方可进入。项目源码在文章开头,下载到本地导入IDEA,修改配置文件中数据库连接信息后,导入项…

字段名称导致mybatisplus自带方法报错.BadSqlGrammarException: ### Error querying database. C

今天在建一个数据表之后,在springboot中使用了mybatisplus代码生成工具生成了java相关代码,在查询的时候,使用的是list()方法查询,发现居然会报错,找了好久。 org.springframework.jdbc.BadSqlGrammarException: ###…

锁策略和死锁问题

锁策略 乐观锁 vs 悲观锁重量级锁 vs 轻量级锁自旋锁 vs 挂起等待锁读写锁 vs 互斥锁公平锁 vs 非公平锁可重入锁 vs 不可重入锁死锁死锁产生的必要条件如何简单的解决死锁问题 小结 这里不是描述的某个特定锁,而是描述的锁的特性,描述的是"一类锁". 乐观锁 vs 悲观…

人到中年三两事儿

人到中年,常常伴随着一系列的焦虑和烦恼。这些焦虑可能源自对工作的不确定性、对未来的担忧、对家庭责任的增加,或是对个人成就的反思。在这个年纪,我们可能会发现自己站在人生的十字路口,面临着重要的选择和决策。 首先&#xff…

数智时代的AI人才粮仓模型解读白皮书(2024版)

来源:极客邦 自 2023 年上半年起,ChatGPT 等大模型技术蓬勃发展,AI 技术不断突破边界,展现 出惊人的潜力和发展速度。从早期的逻辑推理、专家系统,到如今的深度学习、神经网络, AI 技术显著缩小了科学与实…

【面试经典 150 | 二分查找】搜索旋转排序数组

文章目录 写在前面Tag题目来源解题思路方法一:二分查找 写在最后 写在前面 本专栏专注于分析与讲解【面试经典150】算法,两到三天更新一篇文章,欢迎催更…… 专栏内容以分析题目为主,并附带一些对于本题涉及到的数据结构等内容进行…

Redis中的Lua脚本(二)

Lua脚本 创建排序辅助函数 为了防止带有副作用的函数令脚本产生不一致的数据,Redis对math库的math.random函数和math.randomseed函数进行了替换。对于Lua脚本来说,另一个可能产生不一致数据的地方是哪些带有不确定性质的命令,比如对于一个集…

STM32串口通信

一、串口发送 1.初始化引脚 void Serial_Init(uint32_t BaudRate) {RCC_APB2PeriphClockCmd (RCC_APB2Periph_GPIOA ,ENABLE );RCC_APB2PeriphClockCmd (RCC_APB2Periph_USART1 ,ENABLE );GPIO_InitTypeDef GPIO_InitStructure;GPIO_InitStructure.GPIO_Mode GPIO_Mode_AF_PP…

python自动化之网易自动点歌

这个代码是是使用的pyautogui库和pyperclip库完成的,这个库是开源的地址如下:https://github.com/asweigart/pyautogui这里详细的用法想学习的可以到这看看 下面是代码: import pyautogui import subprocess import pyperclip import time i…