ruoyi-plus使用Statistic统计组件升级element-plus

原本使用的就是gitee上lionli的ruoyi-plus版本的代码。但是在使用过程中作首页数据看板时想使用elementui的Statistic统计组件。结果在浏览器控制台报错找不到组件el-statistic

于是查看elementui的历史版本,发现是在新版中才有这个组件,旧版本是没这个组件的。然后在前端中查看package.json文件中的elementui的版本号,发现果然是旧版。

原element-plus版本号"element-plus": "^2.1.8",

于是升级element-plus到最新版。

 "element-plus": "^2.4.2",

仅作记录,修改如下:

首先修改package.json文件中的dependencies下的element-plus版本号

        "element-plus": "^2.4.2",

第二步,因为我是直接将另一台电脑的工程文件复制到的现在的电脑上,所以我为了避免出现莫名其妙的问题,直接将node_modules整个前端依赖删除了。之后以管理员身份进入到vue路径下,执行npm install重新进行依赖安装。

同时进入到文件vite.config.js中修改defineConfig下的plugins的内容,将红框中的添加上去。

然后进入到前端包执行npm run dev,报错

failed to load config from E:\ideaWorkSpace\ha-erp-vue\vite.config.js
error when starting dev server:                                                 
Error: Cannot find module 'unplugin-auto-import/vite' 

缺少了依赖,于是再次进入目录执行命令安装对应依赖:

npm install -D unplugin-vue-components unplugin-auto-import
或者
yarn add unplugin-vue-components unplugin-auto-import -D

安装完以后再次运行,报错

Internal server error: No known conditions for "./lib/locale/lang/zh-cn" entry in "element-plus" package
  Plugin: vite:import-analysis
  File: E:/ideaWorkSpace/ha-erp-vue/src/main.js
      at bail (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:38597:8)
      at resolve (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:38669:9)
      at resolveExports (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:40982:12)
      at resolveDeepImport (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:41000:31)
      at tryNodeResolve (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:40773:20)
      at Context.resolveId (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:40581:28)
      at async Object.resolveId (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:39254:32)
      at async TransformContext.resolve (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:39028:23)
      at async normalizeUrl (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:58348:34)
      at async TransformContext.transform (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:58503:57)
      at async Object.transform (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:39317:30)
      at async doTransform (E:\ideaWorkSpace\ha-erp-vue\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:50037:29)

这个应该是因为升级了element-plus版本导致的错误,

主要是element-plus默认为英文,在设置中文的时候报了错

将这块内容修改如下

import locale from "element-plus/es/locale/lang/zh-cn";

升级完毕,统计组件可正常使用,不再报错找不到组件el-statistic


 

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

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

相关文章

第六届传智杯第四题(abb)

描述 leafee 最近爱上了 abb 型语句,比如“叠词词”、“恶心心” leafee 拿到了一个只含有小写字母的字符串,她想知道有多少个 "abb" 型的子序列? 定义: abb 型字符串满足以下条件: 字符串长度为 3 。字符…

高防CDN可以起到什么作用?

高防CDN相对于普通的CDN加速,除了具备基础的加速功效外,高防CDN在每一节点上均有相应配置的防御功效,不仅具备了隐藏源站不被攻击的优势,也具备了访问加速,多节点防御的功效。随着互联网的不断发展,网络上的…

网络安全技术

网络安全概述 网络安全基础要素 机密性,完整性,可用性,可控性,可审查性 常见网络攻击和特点 1.网络监听 使用sniffer软件或主机接口设置成混杂模式,监听网络中的报文 使用加密技术防范 2.重放攻击 攻击者发送一…

【运维】hive 高可用详解: Hive MetaStore HA、hive server HA原理详解;hive高可用实现

文章目录 一. hive高可用原理说明1. Hive MetaStore HA2. hive server HA 二. hive高可用实现1. 配置2. beeline链接测试3. zookeeper相关操作 一. hive高可用原理说明 1. Hive MetaStore HA Hive元数据存储在MetaStore中,包括表的定义、分区、表的属性等信息。 hi…

软件工程 课堂测验 选择填空

系统流程图用图形符号表示系统中各个元素,表达了系统中各个元素之间的 信息流动 喷泉模型是一种以用户需求为动力,以 对象 为驱动的模型。 软件生存周期中最长的是 维护 阶段。 变换流的DFD由三部分组成,不属于其中一部分的是 事务中心 软…

前端面试灵魂提问

1.自我介绍 2.在实习中,你负责那一模块 3.any与unknow的异同 相同点:any和unkonwn 可以接受任何值 不同点:any会丢掉类型限制,可以用any 类型的变量随意做任何事情。unknown 变量会强制执行类型检查,所以在使用一个…

Python 多层级导包

假如我的项目层级结构如下,project文件夹为项目根路径: project/ ├── first/ │ ├── __init__.py │ ├── second/ │ │ ├── __init__.py │ │ └── second_test.py │ └── first_test.py └── main.py假设项目入口文…

工具及方法 - 如何阅读epub文件:使用Adobe Digital Editions

EPUB(Electronic Publication的缩写,电子出版)是一种电子图书标准,由国际数字出版论坛(IDPF)提出;其中包括3种文件格式标准(文件的扩展名为.epub),这个格式已…

【模电】晶闸管

晶闸管 结构和等效模型工作原理晶闸管的伏安特性晶闸管的主要参数额定正向平均电流 I F I\tiny F IF维持电流 I H I\tiny H IH触发电压 U G U\tiny G UG和触发电流 I G I\tiny G IG正向重复峰值电压 U D R M U\tiny DRM UDRM反向重复峰值电压 U R R M U\tiny RRM URRM 晶体闸流…

对Laxcus分布式操作系统的认知、价值、痛点解决的回答

下面是一位网友的提问,回答贴出来供大家参考,欢迎在下方留言评论。 问: Laxcus分布式操作系统有哪些与众不同的地方?它的价值在哪里?解决了哪些市场痛点?我公司现在已经使用Linux操作系统部署了一堆服务器…

设计模式-模板方法模式

定义 模板方法模式是一种行为型设计模式,它定义了一个算法的步骤,并允许子类别为一个或多个步骤提供其实践方式。这种模式允许子类在不改变算法结构的情况下,重新定义算法的特定步骤。 模板方法模式的结构包括抽象类和具体子类。抽象类负责…

android 内存分析(待续)

/proc/meminfo memory状态解读 命令:adb shell cat /proc/meminfo内存分布log 查看方式 命令:adb shell cat /proc/meminfo 用途:可以整体的了解memory使用情况 我们说的可用memory一般以MemAvailable的数据为准。所以了解MemAvailable的组成可以帮助…

【LeetCode刷题-链表】--86.分隔链表

86.分隔链表 /*** Definition for singly-linked list.* public class ListNode {* int val;* ListNode next;* ListNode() {}* ListNode(int val) { this.val val; }* ListNode(int val, ListNode next) { this.val val; this.next next; }* }*/ class…

建筑木模板厂家批发

在建筑施工中,木模板是一种常见且重要的施工材料,用于搭建混凝土浇筑的支撑结构。选择合适的建筑木模板厂家进行批发,对于施工质量和效率至关重要。本文将介绍建筑木模板厂家批发的重要性,并推荐贵港市能强优品木业作为专业的建筑…

将文件读入C中的字符数组

当您使用 C 编程语言时,您可能会遇到一些需要将文件读入字符数组的问题,例如分析每个字符的频率,或者将所有句子的每个起始词从小写转换为大写,反之亦然。该解决方案非常简单,但对于不太了解文件读取或写入的人来说可能…

MVVM 模式与 MVC 模式:构建高效应用的选择

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云…

世岩清上:什么是元宇宙

元宇宙是一个虚拟的数字世界,它是一种全新的互联网形式,是一个可以提供身临其境体验的虚拟世界。元宇宙融合了现实和虚拟,允许用户在这个数字空间中自由探索、创造和交互。 元宇宙的概念源于科幻小说和电影,它最早出现在1992年的…

【SQL SERVER】定时任务

oracle是定时JOB,sqlserver是创建作业,通过sqlserver代理实现 先看SQL SERVER代理得服务有没有开 选择计算机右键——>管理——>服务与应用程序——>服务——>SQL server 代理 然后把SQL server 代理(MSSQLSERVER)启…

开源vs闭源,大模型的未来在哪一边?

开源和闭源,两种截然不同的开发模式,对于大模型的发展有着重要影响。开源让技术共享,吸引了众多人才加入,推动了大模的创新。而闭源则保护了商业利益和技术优势,为大模型的商业应用提供了更好的保障。 那么&#xff0c…

Vue3+java开发组队功能

Vue3java开发系统组队功能 需求分析 创建用户可以创建一个队伍(一个房间队长),设置队伍人数,队伍名称(标题),描述,超时时间。搜索加入,用户可以加入未满的队伍&#xf…