【背景】
VR 扩展引入的 u-icon 组件通过 easycom 全局注册,导致主包引入:
- u-icon.wxss base64 副本 224.7 KB
- iconfont.json 元数据 85.8 KB
- u-icon.vue 1.7 KB
合计 ≈312 KB 冗余。
原版项目已有 <iconfont> 全局组件,功能等价。直接用 iconfont 替换可彻底消除冗余。
【变更】
1) components/iconfont/iconfont.vue 增强
- 新增 #ifdef APP-NVUE 分支(合并 u-icon.vue 的 NVUE 逻辑)
- iconfontCode computed:剥离 'icon-' 前缀后查 glyphs
- iconSizeNvue computed:NVUE 单位补全
- mounted 中调用 domModule.addRule('fontFace') 注册字体
- 保留全部 iOS 修复注释
2) 替换 31 处 <u-icon> → <iconfont>
- 属性映射:propName→name(+icon-前缀)、propColor→color、propSize→size
- 动态 :propName 改写为 :name="'icon-'+var"
3) 删除
- components/u-icon/u-icon.vue
- components/u-icon/ 空目录
4) 修改的 11 个文件
- pages/plugins/video/detail/detail.nvue (14 处)
- pages/plugins/video/components/{loading,comment-info,comment-more,search}.vue (5 处)
- pages/plugins/live/pull/pull.vue + pull.nvue (3 处)
- pages/plugins/live/pull/components/{goods,live-content}/*.vue (7 处)
- components/u-popup/u-popup.vue (1 处)
- components/u-share-popup/u-share-popup.vue (1 处)
【效果】
- 用户实测:主包 2347.6 KB → 1997.9 KB(与原版 6.8 持平)
- 进一步在 HBuilder 中将 iconfont.json 加入自动排除列表后 → 1919.7 KB
- 比原版 6.8(1997 KB)小 77 KB
【风险】
- LOW(gitnexus detect_changes: 0 affected processes)
- NVUE 兼容性:iconfont.vue 已继承 u-icon.vue 全部 NVUE 逻辑(用户实测视频详情页正常)
- 直播场景:因项目无直播环境,未在生产 NVUE 验证(待启用时手动测试)
【验证】
- 用户实测:视频详情页、商品页图标显示正常
- 弹窗关闭图标(u-popup / u-share-popup)显示正常
|
||
|---|---|---|
| .vscode | ||
| common | ||
| components | ||
| docs | ||
| locale | ||
| node_modules | ||
| pages | ||
| static | ||
| uniCloud-aliyun/cloudfunctions/getPhoneNumber | ||
| uni_modules | ||
| .gitignore | ||
| .prettierrc.cjs | ||
| App.vue | ||
| App_local.vue | ||
| LICENSE | ||
| README.md | ||
| androidPrivacy.json | ||
| backend-review-report.md | ||
| changelog.md | ||
| i18n_tools.config.js | ||
| main.js | ||
| manifest.json | ||
| package-lock.json | ||
| package.json | ||
| pages.json | ||
| plan.md | ||
| template.h5.html | ||
| vue.config.js | ||
README.md
ShopXO企业级免费开源电商系统 - uniapp手机端
如果对您有帮助,您可以点右上角 “Star” 收藏一下 ,获取第一时间更新,谢谢!
项目介绍
- 后端支持依托于ShopXO免费开源电商系统开发的uniapp端主题源码
- 支持可视化DIY拖拽装修,内置几十种标准组件,商品、文章、图片魔方、热区、视频、轮播、自定义等等...
- 默认内置8中搭配主色(可自行扩展更多配色、自由快捷切换),商店提供海量适配各行业的DIY模板
- 已支持小程序(微信、QQ、百度、支付宝、头条&抖音、快手)+ H5 + APP
使用教程
程序打包操作需要有一定的编程技术基础、如需帮助请到git平台提issues寻求帮助
- 先安装ShopXO免费开源系统 http://install.shopxo.net/
- 将该源码导入HBuilderX开发工具、顶部工具栏
运行->运行到小程序模拟器->(根据支持平台自行选择、如 微信开发者工具) - App.vue中修改 request_url 和 static_url 地址为自己的商城地址即可使用
- 主题默认为红色(red),如更改主题 App.vue文件中修改 default_theme 默认主题标识,也可以到商店搜索【默认主题样式】远程控制主题配色
- 发布、HBuilderX开发工具、顶部工具栏
发行->(根据支持平台自行选择、如 微信开发者工具)
官方QQ群、答案shopxo.net
- 官方uniapp群:679303149
体验码
当前项目源代码平台
- Gitee:https://gitee.com/zongzhige/shopxo-uniapp
- GitHub:https://github.com/gongfuxiang/shopxo-uniapp
- Coding:https://zongzhige.coding.net/public/shopxo/uniapp/git
- GitCode:https://gitcode.com/zongzhige/shopxo-uniapp
- uni-app:https://ext.dcloud.net.cn/plugin?id=6380
ShopXO后端源代码平台
- Gitee:https://gitee.com/zongzhige/shopxo
- GitHub:https://github.com/gongfuxiang/shopxo
- Coding:https://zongzhige.coding.net/public/shopxo/shopxo/git
- GitCode:https://gitcode.com/zongzhige/shopxo
DIY装修源代码平台
- Gitee:https://gitee.com/zongzhige/shopxo-diy
- GitHub:https://github.com/gongfuxiang/shopxo-diy
- GitCode:https://gitcode.com/zongzhige/shopxo-diy
Form表单源代码平台
- Gitee:https://gitee.com/zongzhige/shopxo-form
- GitHub:https://github.com/gongfuxiang/shopxo-form
- GitCode:https://gitcode.com/zongzhige/shopxo-form



