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

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

相关推荐
Penge66620 分钟前
《Go 后端开发者学 React:组件通信与插槽》
javascript
Penge6662 小时前
《Go 后端开发者学 React:useState》
javascript
Penge6662 小时前
《Go 后端开发者学 React:数据渲染》
javascript
ikoala5 小时前
AI 写页面像说明书,修 Bug 像贴膏药?把这两句话写进 AGENTS.md
前端·javascript·ai编程
Penge6665 小时前
《Go 后端开发者学 TypeScript:ES Module了解》
javascript
Penge6665 小时前
《Go 后端开发者学 TypeScript:从零搭建与运行》
javascript
Penge6666 小时前
《Go 后端开发者学 TypeScript:keyof关键字》
javascript
Penge6667 小时前
《Go 后端开发者学 TypeScript:extends关键字》
javascript
张张123y7 小时前
DSH 插件调试避坑:client.js 设置面板、热重载与高频报错排查表
开发语言·javascript·人工智能·开源·ecmascript·后端开发·ai agent
Penge66612 小时前
《Go 后端开发者学 TypeScript:typescript 类型断言》
javascript