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

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

相关推荐
@大迁世界4 分钟前
20.“可复用组件”具体指的是什么?如何设计与产出这类组件?.
开发语言·前端·javascript·ecmascript
英俊潇洒美少年32 分钟前
Vue Hook 与 React Hook 全面解析:区别、用法、实战及避坑指南
前端·vue.js·react.js
吴声子夜歌38 分钟前
ES6——Symbol详解
开发语言·javascript·es6
han_hanker40 分钟前
js 加减乘除精度问题2
开发语言·javascript·ecmascript
PD我是你的真爱粉1 小时前
AI Agent 完全指南:LangChain Agent、ReAct、Copilot-Agent 模式、Manus、Computer Use 与记忆机制
人工智能·react.js·langchain
ldybk1 小时前
教学vue
前端·javascript·vue.js
英俊潇洒美少年1 小时前
Vue3 实现 AI 流式打字机(SSE+时间切片模拟 React 并发)工程化完整版
前端·人工智能·react.js
卷卷说风控1 小时前
工作流的 Skill 怎么写?
java·javascript·人工智能·chrome·安全
还是大剑师兰特1 小时前
Pinia介绍及Vue3配置示例
前端·javascript·vue.js