【React】版本正确安装echarts-liquidfill(水球图表)包引入不成功问题

目标效果图:

安装:

npm install echarts

npm install echarts-liquidfill

引入:

复制代码
Import:

import * as echarts from 'echarts';
import 'echarts-liquidfill'   或    import 'echarts-liquidfill/src/liquidFill.js'

Or:

import * as echarts from 'echarts/core';
import 'echarts-liquidfill

需要注意(版本问题):

echarts5.x 版本 适用于 echarts-liquidfill3

echarts4.x 版本 适用于 echarts-liquidfill2

报错:

错误原因:

echartsecharts-liquidfill版本不兼容

echarts-liquidfill插件安装成功,需重启项目(看个人)

echartsecharts-liquidfill版本冲突,(明明重新安装了对应版本缺还是报错),原因:之前进行过多次安转node_modules里面还有之前安装的版本文件,引入文件时有可能会引入不正确(import 'echarts-liquidfill'),例如:
echartsecharts-liquidfill都有可能不小心进行多次安装

解决方法:删除不需要的版本文件,重新启动项目

相关推荐
默_笙7 小时前
🚋 从流水线到地铁网:为什么复杂 AI 都要拆成多 Agent(上)——LangGraph 基础入门
前端·javascript
moMo7 小时前
React Hooks 与闭包
前端·react.js
ID34610744207 小时前
【课程设计】基于Spring Boot+Vue的游戏账号租赁系统的设计与实现-计算机毕设 附源码50345
javascript·vue.js·spring boot·python·node.js·php·课程设计
柚yuzumi7 小时前
彻底搞懂 JavaScript 类型转换:显式转换、隐式转换与 ToPrimitive
前端·javascript·node.js
张明君644517 小时前
接口返回 6 条,页面却有 7 篇:从源码看 React 和 Vue 的重复 key
react.js
师傅别念了8 小时前
React Hooks 踩坑合集,全是血泪教训
react.js
AI情绪识别开源9 小时前
检信ALLEMOTION 认知评估分析器 · WebSocket 推送数据文档
javascript
OpsEye9 小时前
公司内部全员使用 AI,如何保证会话合规、行为可审计?
javascript·ai编程
变与不变8069 小时前
JS事件机制精讲
前端·javascript