uniapp+vue3+vites使用lime-echart问题记录

问题记录

1.vue3使用echarts,H5和微信小程序兼容问题

问题描述,正常使用echarts,H5正常,小程序报错

报错信息如下

解决方案:

注意要点一:vue3需要使用esm文件

地址:https://github.com/apache/echarts/tree/master/dist,找到并下载了echarts.esm.min.js改名为echarts.min.js直接将路径下uni_modules/lime-echart/static/echarts.min.js的文件替换了esm格式的文件.

注意要点二:引入需要使用兼容写法,微信小程序的引入不需要esm,正常的echarts.min.js就可以

javascript 复制代码
// nvue 不需要引入
// #ifdef VUE2
import * as echarts from '@/uni_modules/lime-echart/static/echarts.min';
// #endif
// #ifdef VUE3
// #ifdef MP
// 由于vue3 使用vite 不支持umd格式的包,小程序依然可以使用,但需要使用require
const echarts = require('../../static/echarts.min');//微信小程序,这个是正常的
// #endif
// #ifndef MP 
// 由于 vue3 使用vite 不支持umd格式的包,故引入npm的包
	import * as echarts from '@/uni_modules/lime-echart/static/echarts.min'//除了微信小程序其他的用法,这个是esm的
// #endif
// #endif
相关推荐
Geek_Vison1 天前
2026 跨端框架横评:FinClip、Taro、uni-app、Remax、mPaaS 五款工具技术+业务双维度测评
小程序·uni-app·taro·mpaas·小程序容器
RuoyiOffice1 天前
从 0 到 1 搭建 RuoyiOffice:30 分钟跑通后端+前端+移动端
前端·spring boot·uni-app·开源·oa·ruoyioffice·hrm
Geek_Vison1 天前
APP集成了50多个小程序后,如何搭建一个小程序管理平台来管理这些小程序~
小程序·uni-app·apache·mpaas·小程序容器
梦曦i2 天前
uni-router v1.1.1发布:守卫超时保护+路由监听
前端·uni-app
梦曦i2 天前
全面解析uni-router v1.2.0功能
前端·uni-app
不如摸鱼去2 天前
Wot UI 2.1.0 发布:ConfigProvider 全局配置能力升级
ui·小程序·uni-app
PedroQue992 天前
uni-router:uni-app路由管理新选择
前端·uni-app
这是个栗子2 天前
微信小程序开发(九)- uni-app微信小程序商城
微信小程序·小程序·uni-app·vue·vuex
中犇科技2 天前
2026商城APP开发公司 TOP5(电商垂直版)
uni-app
扁豆的主人2 天前
Uniapp如何构建和部署
uni-app