【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

报错:

错误原因:

echarts与echarts-liquidfill版本不兼容

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

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

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

相关推荐
普通人619 分钟前
uniapp模版JS
开发语言·javascript·小程序·uni-app·1024程序员节
KumaoHub19 分钟前
棋牌游戏开发中聊天文本的长度限制与安全显示
javascript
G018_star sky♬1 小时前
nodeJS他是如何用JavaScript封装C++的呢
开发语言·javascript·c++
Highcharts.js1 小时前
2026年,AI正在重写技术:“工具思维”正在失效?
人工智能·echarts·客户端·highcharts·可视化图表·企业级图表
wiseyao12191 小时前
uniapp scroll-view滚动到最后
前端·javascript·uni-app
怕浪猫1 小时前
Step 5 Preview 模型写 3D 象棋,两个小时上线
前端·javascript·面试
Highcharts.js2 小时前
Highcharts甘特图开发带导航功能的项目管理图示例
开发语言·前端·javascript·甘特图·highcharts·项目管理图
Hilaku2 小时前
前端不懂业务有多可怕?
前端·javascript·程序员
FRing032 小时前
JavaScript入门到精通二十八(forEach遍历、创建对象的三种方式、构造函数、new实例化执行过程、实例成员和静态成员)
开发语言·前端·javascript
进击的丸子3 小时前
代理网络环境下 Linux Pro 在线激活实操指南
javascript·后端·安全