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

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

相关推荐
悟空瞎说9 分钟前
从isMounted到跨页面状态:高级前端如何优雅解决订单场景的“幽灵陷阱”(附React/Vue完整代码)
前端·javascript
sheeta199813 分钟前
TypeScript references 配置与 emit 要求详解
javascript·ubuntu·typescript
神の愛17 分钟前
js的深拷贝和浅拷贝?啥情况讲解下??底层堆栈空间??object.prototype.toString.call(),还有bind,的具体使用?
前端·javascript·原型模式
浩星18 分钟前
「React + Cesium 最佳实践」完整工程化方案
前端·vue.js·react.js
1314lay_100725 分钟前
el-table表格数据分页切片,导致表格的多选失效
javascript·vue.js·elementui
qq_120840937130 分钟前
Three.js 模型加载稳定性实战:从资源失败到可用发布的工程化方案
前端·javascript·vue.js·vue3·three.js
阿正的梦工坊33 分钟前
JavaScript 闭包:从入门到精通
开发语言·javascript·ecmascript
qq_120840937134 分钟前
Three.js 性能实战:大场景从 15FPS 到 60FPS 的工程化优化路径
开发语言·前端·javascript
guhy fighting1 小时前
使用vue-virtual-scroller导致打包报错
前端·javascript·vue.js·webpack
光影少年1 小时前
前端开发桌面端都有哪些框架?
前端·react.js·electron