1. add @titleUpdate event listener for web-view component 2. decode uri component for title and enableSetTitle params 3. refactor updateNavbarTitle to accept dynamic new title 4. add debug console logs for tracking title update flow 5. add success/fail callbacks for navigation bar title setting
小程序及快应用前端源码
1. 📋 项目说明
该项目基于 uni-app 开发构建,请使用 HBuilderX 进行代码开发及构建发布。
2. 🛠️ 开发说明
- 源码基于 Vue2 版本
- SCSS 采用 dart-sass 进行编译输出
3. 🔧 开发调试说明
3.1 注意事项
- 应用访问等关键参数的配置来源于
./common/js/config.js
3.2 本地调试
.local.config.js.example 是本地调试配置示例。
拷贝 .local.config.js.example 为 .local.config.js 文件,默认开发调试模式会自动加载该文件
4. 📦 发布说明
4.1 小程序发布
4.1.1 基本操作步骤(通用版/定制化版)
##### ##### ##### 【前置准备】
- 在项目根目录打开终端安装依赖:
已有依赖可跳过此步骤
npm install
##### ##### ##### 【发布构建】
- 使用 HBuilderX 打开项目(不用改manifest.json的web,只有H5要改 )
- 选择菜单栏「发行」 → 「小程序-微信」→ 「发行」,等待构建完成 ⚠️ 注意:底部控制台弹出"请在微信小程序开发者工具中点击上传"后再执行下一步
- 构建完成后,自动执行补丁脚本(拷贝 site.js / config 文件 + 生成 ZIP 包),无需手动操作
- 找到项目根目录
/unpackage/dist/build下生成的 mp-weixin 压缩包 💡 示例:mp-weixin-2026-05-11-3bff91e.zip压缩包文件名末尾为 Git 提交 ID 同时该目录下会生成未压缩的mp-weixin目录
##### ##### ##### 【验证与重命名】
-
打开未压缩的
mp-weixin目录,找到site.js文件,将文件内的uniacid值改为当前客户编号(如:2812)并保存 -
打开微信开发者工具,导入「mp-weixin」目录,点击「编译」,在开发者工具控制台验证有无报错,以及能否返回对应客户的业务数据
-
确保无误后将生成的 mp-weixin 压缩包重命名
- 定制化版格式:
定制化-客户编号-域名-mp-weixin-当前日期-Git提交ID.zip - 通用版无需重命名
💡 示例:
custom-2812-xcx.aigc-quickapp.com-mp-weixin-2026-05-11-3bff91e.zip🚫 禁止:压缩包命名禁止包含
/ \ : * ? " < > |等特殊字符 - 定制化版格式:
##### ##### ##### 【交付与最终发布】🔍
- 将重命名后的文件发送给技术人员 📌通用版直接将生成的 mp-weixin 压缩包发送给技术人员
- 技术人员操作流程:
- 解压压缩包
- 确认
site.js中的uniacid为客户编号 - 用微信开发者工具导入解压后的代码目录
- 编译验证无误后,上传发布
4.1.2 鸿蒙小程序发布(mp-harmony)
##### ##### ##### 【发布构建】
- 使用 HBuilderX 打开项目
- 选择菜单栏「发行」 → 「HarmonyOS」→ 「发行」,等待构建完成
- 构建完成后,自动执行
harmony.patch.js补丁脚本(配置拷贝 + ZIP 打包) - 找到项目根目录
/unpackage/dist/build下生成的 mp-harmony 压缩包
##### ##### ##### 【交付与最终发布】🔍
- 将生成的
.zip文件发送给运维人员 - 运维人员操作流程:
- 解压压缩包
- 打开鸿蒙开发者工具,导入解压后的代码目录
- 验证代码无报错后,执行上传发布操作
##### ##### ##### 【本地设置】

4.2 快应用发布
4.2.1 基本操作(通用版/定制化版)
4.2.1.1 【发布构建】
-
使用 HBuilderX 打开项目
-
打开项目根目录的
manifest.json文件,切换至可视化配置界面:- 依次点击「Web 配置」→「运行的基础配置」
- 根据情况查看是否修改路径中/hwappx/????/的客户编号
📌 通用版保留原有
/hwappx/common/📌 测试版保留原有/hwappx/test/💡 个性化定制示例:/hwappx/2811/,其中 2811 为定制化版客户编号
-
选择菜单栏「发行」 → 「自定义发行」 → 选择对应的站点脚本 💡 例如:网址是
5g.aigc-quickapp.com选H5-5g.aigc-quickapp.com -
修改以下配置:
- 网站标题:快应用
- 网站域名:当前客户域名
- 确认后点击「发行」等待构建完成
⚠️ 注意:构建完成后自动输出到
unpackage/dist/build/h5/,格式为{域名}-{base路径}.zip💡 示例:xcx.aigc-quickapp.com-hwappx.common-3bff91e-20260511_1058.zip
4.2.1.2 【交付与最终发布】🔍
- 将生成的
.zip文件发送给运维人员 - 运维人员操作流程:
- 解压压缩包
- 打开快应用开发者工具,导入解压后的代码目录
- 验证代码无报错后,执行上传发布操作
4.2.1.3 【测试流程】
H5:打开自己的浏览器输入网址(https://5g.aigc-quickapp.com/hwappx/common/?uniacid=75)改站点 如果是test就把hwappx/common/改为hwappx/test/----------改站点
5. 📝 构建与版本信息
5.1 自动注入机制
生产构建时,vue.config.js 中的 VersionInjectPlugin 会自动执行以下操作:
| 操作 | 适用平台 | 说明 |
|---|---|---|
__app_version 全局变量注入 |
所有平台 | 构建产物的 vendor.js(小程序)或 index.html(H5)中自动内联版本数据 |
| 构建版本信息查看 | 所有平台 | 首页右下角连击 5 次弹出模态框显示 commitId 和 buildTime |
| 极限压缩优化 | 小程序(mp-weixin / mp-harmony) | 生产构建自动应用多层次压缩配置,显著减小产物包体积 |
版本数据包含:
- commitId:当前构建的 Git 短提交 ID
- buildTime:构建时间
开发模式:HMR 热更新时由 webpack emit 钩子自动处理,不影响开发体验。
5.2 自动 ZIP 打包
H5 自定义发行构建完成后自动执行:
| 步骤 | 说明 |
|---|---|
| 重命名输出目录 | {域名}-{base路径用.连接}(如 xcx.aigc-quickapp.com-hwappx.common) |
| 创建 ZIP 文件 | 文件名格式:{目录名}-{Git提交ID}-{上海时区时间戳}.zip |
| 清理 | ZIP 创建完成后自动删除源目录 |
💡 示例 ZIP:xcx.aigc-quickapp.com-hwappx.common-3bff91e-20260511_1058.zip
微信小程序生产构建时自动执行:
- 拷贝
site.js/project.config.json/project.private.config.json文件到构建目录 - 创建 ZIP 包(文件名包含 Git 提交 ID)
鸿蒙小程序生产构建时自动执行:
- 拷贝必要配置文件到构建目录
- 创建 ZIP 包(文件名包含 Git 提交 ID)
5.3 环境配置
域名配置统一通过 package.json 中各脚本的 env.UNI_APP_DOMAIN 传入:
"h5-xcx.aigc-quickapp.com": {
"title": "...",
"env": {
"UNI_PLATFORM": "h5",
"UNI_APP_DOMAIN": "https://xcx.aigc-quickapp.com/"
},
"define": { "PRODUCTION": true }
}
config.js 和 vue.config.js 均通过 process.env.UNI_APP_DOMAIN 读取,新增/删除脚本无需改动代码。
6. 🔄 版本历史
6.1 v1.5.1
VersionInjectPlugin:webpack emit 钩子自动注入__app_version到所有平台产物- 首页右下角连击 5 次显示构建版本信息(commitId + buildTime)
mp-weixin.patch.js精简为仅文件拷贝和 ZIP 打包- 新增
harmony.patch.js:鸿蒙小程序生产构建补丁脚本(配置拷贝 + ZIP 打包) open-directory.js:构建完成后自动打开输出目录- 极限压缩优化:集成
zion-uniapp-mp-load-package插件 + TerserWebpackPlugin 多层次压缩配置 - 修复
openWxWorkServiceChat方法中 fail 回调语法错误 - ZIP 文件名末尾使用 Git 提交 ID 替换时间戳
- 构建脚本幂等性修复,支持多次运行不产生重复注入
6.2 v1.3
- 修复微信小程序构建脚本,支持复制
project.config.json和project.private.config.json文件 - 增强构建脚本功能,添加命令行参数支持
- 在
package.json中添加相关 npm 脚本命令 - 优化脚本执行逻辑,提高可靠性和灵活性