Rocker_Lau
Rocker_Lau
  • 发布:2020-02-14 13:01
  • 更新:2020-02-14 18:00
  • 阅读:1293

uniapp启动treeShaking打h5生产包,打出来的页面报错,如何排查?

分类:uni-app

问题描述

uniapp,打h5生产包,打包过程没有报错,成功输出dist,访问页面的时候报错(如下图)

经排查,在manifest.json处,关闭treeShaking就没有报错了,但我还是希望找到原因,继续用上treeShaking的功能

环境与版本

  • Mac、Window10均有这种情况
  • "@dcloudio/uni-h5": "2.0.0-25120200103006"
  • "@dcloudio/vue-cli-plugin-uni": "2.0.0-25120200103006"
  • "@dcloudio/vue-cli-plugin-uni-optimize": "2.0.0-25120200103006"

打包命令

cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build --mode prod

manifest.json

{  

"name": "xxxx",  

"appid": "xxxx",  

"description": "xxx",  

"versionName": "xxxx",  

"versionCode": "100",  

"transformPx": false,  

"uniStatistics": {  

"enable": true  

},  

"networkTimeout" : {  

"request" : 150000,  

"connectSocket" : 15000,  

"uploadFile" : 15000,  

"downloadFile" : 15000  

},  

"h5": {  

"usingComponents": true,  

"devServer": {  

"https": false  

},  

"publicPath": "/xxx",  

"template": "index.html",  

"optimization": {  

"treeShaking": {  

"enable": true  

}  

}  

},  

"safearea": {  

"background": "#CCCCCC",  

"bottom": {  

"offset": "auto"  

}  

}  

}

信息补充

  • mall分支,线上版本,h5设置了treeShaking可以访问,没有报错
  • mastertmp分支,开发分支,改造大版本

我的尝试和思路

我的尝试步骤:

  1. 基于mastertmp分支,安装依赖(上述环境和版本),跑开发环境命令,打开浏览器,展示正常,没有报错
  2. 切换到mall分支,跑生产环境命令,生成页面后,挂载服务器下,展示正常,没有报错
  3. 切换到mastertmp分支,跑生产环境,生成页面后,挂载服务器下,报错如上图
  4. 基于mastertmp分支,manifest.json去掉uniStatistics,没有上图的报错,但是跑业务代码的时候,遇到使用uni.x的API都会报类似的错误
  5. 基于mastertmp分支,manifest.json去掉treeShaking功能,一切正常

我的排查:

  1. 依赖包问题,排除。从步骤1和步骤2可知,可以排除依赖包的问题,因为在步骤1安装依赖后,再到步骤2跑的。是基于mastertmp的依赖的
  2. 我的编译条件写错了的问题(编译条件的使用,成对规则、语法规则),排除。排查过没有问题
  3. 我的业务代码问题,排除。page.json去掉所有业务页面,留下一个hello world页面,查看App.vue、main.js代码,去掉没有必要的引用,还是会报错
  4. 代码使用了require语法,影响了treeShaking,排除。把涉及的代码都改为import和export了,还是会报错

我的请求

  • 请哪位大佬帮忙看看,提供排查的思路?
2020-02-14 13:01 负责人:无 分享
已邀请:
DCloud_uniCloud_WYQ

DCloud_uniCloud_WYQ

使用最新的alpha试试

该问题目前已经被锁定, 无法添加新回复