【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都有可能不小心进行多次安装

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

相关推荐
怕浪猫6 小时前
第一章 JSX 增强特性与函数组件入门
前端·javascript·react.js
前端小L6 小时前
贪心算法专题(十):维度权衡的艺术——「根据身高重建队列」
javascript·算法·贪心算法
Fortunate Chen7 小时前
类与对象(下)
java·javascript·jvm
ohyeah9 小时前
深入理解 React 中的 useRef:不只是获取 DOM 元素
前端·react.js
低保和光头哪个先来9 小时前
场景6:对浏览器内核的理解
开发语言·前端·javascript·vue.js·前端框架
ji_shuke10 小时前
canvas绘制拖拽箭头
开发语言·javascript·ecmascript
2501_9462447811 小时前
Flutter & OpenHarmony OA系统设置页面组件开发指南
开发语言·javascript·flutter
cz追天之路11 小时前
华为机考 ------ 识别有效的IP地址和掩码并进行分类统计
javascript·华为·typescript·node.js·ecmascript·less·css3
l1t11 小时前
DeepSeek总结的算法 X 与舞蹈链文章
前端·javascript·算法