有家相册(uni-app 跨端前端)
家庭相册、家族树与文档共享的 uni-app 前端:一套源码出 H5、微信小程序、App 三端。 业务后端是 CloudBuilder(.NET),本仓库的前身是旧管理端 WebVue 的迁移工程。
技术栈
Vue 3 + TypeScript + Vite + uni-app + uview-pro + Pinia + vue-i18n。
包管理器统一使用 npm(脚手架附带的 pnpm 配置已移除,请勿提交 pnpm-lock.yaml)。
环境要求
- Node >= 18
- npm >= 9
快速开始
npm install
npm run dev # H5,默认连本机后端
npm run dev:mp-weixin # 微信小程序:产物在 dist/build/mp-weixin,用微信开发者工具导入该目录
npm run dev:app # App:产物在 dist/dev/app,再用 HBuilderX 打包运行
发布构建与检查:
| 命令 | 作用 |
|---|---|
npm run build |
H5 发布构建 |
npm run build:mp-weixin |
微信小程序发布构建 |
npm run build:app |
App 发布构建 |
npm run type-check |
vue-tsc 全量类型检查 |
npm run lint / npm run lint:fix |
ESLint 检查 / 自动修复 |
后端地址(.env 分层)
换环境只改项目根的 .env / .env.development / .env.production,不要在代码里写死地址:
| 变量 | 生效场景 | 缺省回落值 |
|---|---|---|
VITE_WEB_API_ROOT |
发布构建 | https://uat.youjiala.com |
VITE_WEB_API_ROOT_DEV |
开发构建(H5) | http://localhost:5235 |
VITE_WEB_API_ROOT_DEV_APP |
开发构建(App 真机/模拟器) | https://uat.youjiala.com |
变量缺失时由 src/policy/custom/webSitePolicy.ts 的常量兜底,删掉 .env 也能构建出可用产物。
取值口径、新增变量的步骤与三端差异见 src/md/environment.md。
目录速览
src/
├── api/ service/ 后端接口封装(service/* 由代码生成器维护)
├── common/ 请求拦截器、全局错误边界、样式与常量
├── pages/ 页面:login / dashboard / error(page401,403,404)
├── permission/ 权限内核与页面权限表
├── policy/custom/ 站点配置(.env 的 fallback)
├── router/ 路径别名、导航拦截器
├── stores/ Pinia
├── md/ 工程文档(下表)
└── manifest.json 三端应用身份(appid / bundleName)
改代码前先读的文档
| 文档 | 讲什么 |
|---|---|
| src/md/environment.md | .env 分层、mode 映射、三端读取差异 |
| src/md/error-handling.md | 全局错误边界与「已提示过就不再打扰」的口径 |
| src/md/permission.md | 权限模型、页面权限表、菜单可见性 |
| src/md/page-routing.md | 路由别名、导航拦截、错误页跳转链 |
代码风格由 ESLint 约束,但 IDE 里同时生效的 Prettier 与它存在少量对撞规则(箭头括号、运算符换行位置);
冲突写法已在文档里给了规避方式,遇到 --fix 反复回退请改写构造而不是硬碰。
待替换的应用身份
src/manifest.json 与 harmony-configs/build-profile.json5 里的脚手架身份已清成占位,正式发布前需逐项替换:
- DCloud
appid:当前为占位__UNI__YJL0001,需在 HBuilderX 登录自有账号后重新领取 - 微信小程序
appid:故意留空(构建时回落为touristappid,只能本地预览),发布前换成自有 AppID - 鸿蒙
bundleName:当前com.youjiala.app,需与华为侧注册的包名一致 - 鸿蒙签名材料路径:
harmony-configs/build-profile.json5里指向./signing/youjiala.*,需放入自有证书
许可
界面组件库 uview-pro 与其脚手架遵循 MIT(见 LICENSE);业务代码版权归本项目所有。