Basic_Mini:微信小程序脚手架
原生小程序 + TypeScript · 与 Basic_Web 后端完全对齐 · 零框架依赖
为什么做这个
有了 Basic_Web 后端脚手架之后,前端自然也需要一个配套的小程序脚手架。市面上小程序框架很多——Taro、uni-app、mpvue——但我一个都没选。
原因很简单:跨端框架的坑比原生多。样式兼容、组件差异、API 不支持、构建链路复杂——每个坑都能卡你半天。而且一旦框架停更,你就被锁死了。我做的是工具型产品,不需要跨端,只需要微信小程序。原生 + TypeScript 就够了。
Basic_Mini 和 Basic_Web 是一对:后端用 Basic_Web,前端用 Basic_Mini,分层架构、错误处理、权限体系一一对应。改个项目名就能开始写业务。
六层架构
后端有五层,前端有六层。多出来的一层是组件层——小程序的 WXML/WXSS 天然就是组件化的:
| 层 | 职责 | 禁止 |
|---|---|---|
| 页面层 | 渲染 UI、处理交互、调用 Service | 直接调用 API 层、包含业务逻辑 |
| 组件层 | 可复用 UI 单元、接收 properties、触发 events | 直接调用 API 层、管理全局状态 |
| 服务层 | 编排业务流程、跨 API 协调、Token 生命周期 | 直接调用 wx.request、操作 DOM |
| 接口层 | 封装 HTTP 请求、Token 自动刷新、统一错误处理 | 包含业务逻辑、做 UI 提示 |
| 基础设施层 | 本地存储、路由守卫、日志、环境配置 | 包含业务逻辑 |
| 模型层 | TypeScript 类型定义、接口契约 | 包含业务逻辑 |
与 Basic_Web 的对齐
| Basic_Web | Basic_Mini | 对齐点 |
|---|---|---|
| Router 路由层 | pages.json + 路由守卫 | 页面路由 + 访问控制 |
| Service 业务层 | services/ | 业务编排 + 状态管理 |
| Repository 数据层 | api/ | HTTP 请求封装 + 拦截器 |
| Model 模型层 | models/ | 类型定义一一对应 |
| Schema 请求/响应 | models/ | 接口请求/响应类型 |
| Infra 基础设施 | infra/ | 存储/路由/日志/环境 |
| Middleware 中间件 | api/client.ts | 请求拦截/Token 刷新 |
开箱即用的能力
| 能力 | 说明 |
|---|---|
| JWT 双 Token | Access 30分钟 + Refresh 7天,401 自动刷新,刷新失败跳登录 |
| Token 加密存储 | AES 加密后存入 wx.storage,防止反编译泄露 |
| RBAC 权限 | 与 Basic_Web 的 PlatformPermission 对齐,按平台过滤权限 |
| 路由守卫 | 需登录页面自动跳转,需权限页面自动检查 |
| 统一错误处理 | 401/403/429 自动处理,业务错误 Service 层捕获 |
| 分包加载 | 主包 < 2MB,按业务域划分子包 |
| TypeScript 严格模式 | 零 any,所有公共函数有类型注解 |
开发日记
-
Basic_Mini 项目初始化
六层架构搭建、JWT双Token自动刷新、路由守卫、权限组件、与Basic_Web对齐。