124 lines
3.1 KiB
Markdown
124 lines
3.1 KiB
Markdown
# 小程序代码包优化总结
|
||
|
||
## 问题
|
||
- 原始代码包: **40957KB** (40MB)
|
||
- 微信小程序主包限制: **2048KB** (2MB)
|
||
- 错误信息: `main package source size 40957KB exceed max limit 2048KB`
|
||
|
||
## 已完成的优化
|
||
|
||
### 1. 图片压缩 ✅
|
||
压缩了 10 张大图片（位于 `src/static/button/`）：
|
||
|
||
| 文件名 | 原始大小 | 压缩后 | 压缩率 |
|
||
|--------|---------|--------|--------|
|
||
| supervision.jpg | 4423KB | 139KB | 96.9% |
|
||
| assessor.jpg | 4332KB | 137KB | 96.8% |
|
||
| companion.jpg | 4328KB | 127KB | 97.1% |
|
||
| study-tour.jpg | 4298KB | 136KB | 96.8% |
|
||
| special.jpg | 4059KB | 134KB | 96.7% |
|
||
| planner.jpg | 4041KB | 122KB | 97.0% |
|
||
| summer-camp.jpg | 3964KB | 122KB | 96.9% |
|
||
| interest.jpg | 3648KB | 155KB | 95.8% |
|
||
| one-on-one.jpg | 3578KB | 161KB | 95.5% |
|
||
| parent-academy.jpg | 2529KB | 102KB | 96.0% |
|
||
|
||
**总计**: 从 38MB 压缩到 1.3MB，节省 **36.7MB**
|
||
|
||
### 2. 当前代码包大小
|
||
重新编译后的大小分布：
|
||
|
||
| 目录 | 大小 |
|
||
|------|------|
|
||
| static | 2.16MB |
|
||
| pages | 0.69MB |
|
||
| teacher-package | 0.60MB |
|
||
| user-package | 0.45MB |
|
||
| manager-package | 0.43MB |
|
||
| provider-package | 0.34MB |
|
||
| activity-package | 0.32MB |
|
||
| 其他 | ~1MB |
|
||
|
||
**总计**: 约 **6MB**
|
||
|
||
## 问题分析
|
||
|
||
虽然图片已压缩，但代码包仍然是 **6MB**，超过主包 2MB 限制。
|
||
|
||
**根本原因**:
|
||
- 项目使用了多个分包（teacher-package, user-package, manager-package 等）
|
||
- 但这些分包可能没有正确配置为微信小程序的分包
|
||
- 所有代码都被打包到主包中
|
||
|
||
## 解决方案
|
||
|
||
### 方案1: 配置分包加载（推荐）✅
|
||
|
||
微信小程序支持分包加载，主包 + 所有分包总大小不超过 20MB。
|
||
|
||
需要在 `src/pages.json` 中配置 `subPackages`：
|
||
|
||
```json
|
||
{
|
||
"pages": [
|
||
// 主包页面（只保留首页、登录等核心页面）
|
||
],
|
||
"subPackages": [
|
||
{
|
||
"root": "teacher-package",
|
||
"pages": [
|
||
// 教师端页面
|
||
]
|
||
},
|
||
{
|
||
"root": "user-package",
|
||
"pages": [
|
||
// 用户端页面
|
||
]
|
||
},
|
||
{
|
||
"root": "manager-package",
|
||
"pages": [
|
||
// 管理师端页面
|
||
]
|
||
},
|
||
{
|
||
"root": "provider-package",
|
||
"pages": [
|
||
// 服务商端页面
|
||
]
|
||
}
|
||
]
|
||
}
|
||
```
|
||
|
||
### 方案2: 进一步压缩图片
|
||
|
||
如果方案1不够，可以：
|
||
- 将图片质量降低到 75
|
||
- 将最大宽度降低到 800px
|
||
- 使用 WebP 格式（需要兼容性检查）
|
||
|
||
### 方案3: 图片使用 CDN
|
||
|
||
将图片上传到服务器，使用网络图片而不是本地图片。
|
||
|
||
## 下一步操作
|
||
|
||
1. **检查 pages.json 配置** - 确认分包是否正确配置
|
||
2. **如果没有配置分包** - 需要重新配置 pages.json
|
||
3. **重新编译** - 配置后重新编译小程序
|
||
4. **在微信开发者工具中上传** - 检查主包和分包大小
|
||
|
||
## 相关文件
|
||
|
||
- 压缩脚本: `Archive/[一次性]压缩图片-PowerShell-2026-01-31.ps1`
|
||
- 编译脚本: `Archive/[一次性]重新编译小程序-图片压缩后-2026-01-31.bat`
|
||
- 源图片目录: `peidu/uniapp/src/static/button/`
|
||
- 编译输出: `peidu/uniapp/dist/dev/mp-weixin/`
|
||
|
||
## 时间记录
|
||
|
||
- 2026-01-31: 完成图片压缩，从 40MB 降到 6MB
|
||
- 下一步: 配置分包加载
|