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
相关推荐
2501_9160074719 小时前
Flutter与游戏App加固避坑指南:如何为混合开发与高交互应用选对安全方案?
安全·flutter·游戏·ios·小程序·uni-app·iphone
PedroQue9920 小时前
@meng-xi/create-uni-app v1.0.0 正式发布
前端·uni-app
肥仔哥哥193020 小时前
uniapp开发App一键登录:从技术选型到前后端落地实战--2秒登录,流失率减半:在uniapp里接入一键登录的全过程
uni-app·一键登录设计选型
JackieDYH1 天前
uniapp-幸运抽奖转盘组件-案例
uni-app
ModyQyW1 天前
vite-plugin-uni-manifest 更新了什么
前端·typescript·uni-app
PedroQue992 天前
v2.7.1:修复 H5 端返回死循环闪烁问题
前端·uni-app
lhldsg2 天前
AI零售系统实战指南:从架构设计到落地部署全解析
java·人工智能·小程序·uni-app·零售
RisunJan3 天前
uni-app 面试知识点梳理
面试·职场和发展·uni-app
郑州光合科技余经理3 天前
本地生活服务系统:模块边界与结算字段怎么拆
java·开发语言·前端·后端·系统架构·uni-app·php
lhldsg5 天前
家校托管互通系统开发实战:从需求分析到部署全指南
小程序·uni-app·需求分析