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
相关推荐
我这一生如履薄冰~1 天前
uni-app 项目配置代理踩坑
uni-app
毕设源码-朱学姐1 天前
【开题答辩全过程】以 基于uniapp的疫苗预约系统为例,包含答辩的问题和答案
uni-app
CHB2 天前
uni-app,你的最佳vibe coding搭子
uni-app·vibecoding
怀君2 天前
Uniapp——Android离线打包自定义基座教程
android·uni-app
李慕婉学姐2 天前
【开题答辩过程】以《基于uni-app框架的助学管理系统的设计与实现》为例,不知道这个选题怎么做的,不知道这个选题怎么开题答辩的可以进来看看
微信小程序·uni-app
爱吃的强哥2 天前
uni-app 开发微信小程序注意点
微信小程序·小程序·uni-app
2501_915918413 天前
TCP 抓包分析在复杂网络问题中的作用,从连接和数据流层面理解系统异常行为
网络·网络协议·tcp/ip·ios·小程序·uni-app·iphone
じòぴé南冸じょうげん3 天前
APP本地调试正常,但是打包后出现账号密码解析错误,且前端未使用加密解密
小程序·uni-app·web app
快起来搬砖了3 天前
UniApp 路由配置实战:从全局守卫到 404 页面优雅处理
uni-app
5335ld3 天前
uniapp-APP端table列表左侧第一列固定、头部固定
windows·uni-app