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

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

相关推荐
泯泷23 分钟前
手搓JSVM第 9 篇:闭包:函数如何记住外部变量
前端·javascript·前端框架
晴天1640 分钟前
前端 SSR、BFF 原理介绍
前端·javascript·网络·html
梦想平凡2 小时前
百游棋牌源代码开发搭建教程(一):全端工程结构、开发环境配置与首次启动验证
前端·javascript·源代码管理
Highcharts2 小时前
常见报错排雷指南3:兼容性问题的官方解法
javascript·数据可视化
5335ld2 小时前
app版本更新(vue3+unibest+静默更新+强制更新)
开发语言·javascript·ecmascript
Cho1yon3 小时前
【AI Agent 第十五期: AI Agent 从 0 到 1 系统学习大纲】
javascript·人工智能·学习
web打印社区5 小时前
Vue3 发票静默打印,我这边能跑通的一版
前端·javascript·vue.js·chrome·electron
嘟哩DuliDuli5 小时前
创作 Agent 的任务状态该如何保存
android·java·javascript
lemon_sjdk6 小时前
JavaScript 常用关键字全解析
开发语言·javascript·ecmascript
高申航6 小时前
Vue 3 + DYMO Connect Framework 实战:从标签模板到打印服务的完整实现
前端·javascript·vue.js