修改了主题切换的问题,但登录故障问题还有残留
This commit is contained in:
@@ -97,6 +97,42 @@ npm run build:weapp
|
||||
npm run dev:h5
|
||||
```
|
||||
|
||||
## 图片资源与包体积说明
|
||||
|
||||
当前项目的产品实物照片(`src/img/`)已内置在小程序中。由于微信小程序**预览/上传代码包体积上限为 2MB**,大量高分辨率照片会导致超限。
|
||||
|
||||
### 已采取的措施(两步压缩脚本)
|
||||
|
||||
- `compress-images.js`(基于 [sharp](https://sharp.pixelplumbing.com/))已配置到项目中,支持批量:
|
||||
1. **resize**:最大边长限制到 800px
|
||||
2. **format**:PNG → JPG
|
||||
3. **quality**:JPG 质量 60%
|
||||
- 执行一次即可:`node compress-images.js`
|
||||
- 当前编译后 `dist/` 总大小约 **1.02 MB**,满足微信限制。
|
||||
|
||||
### ⚠️ 注意:压缩 ≠ 长期方案
|
||||
|
||||
压缩后的图片在手机上画质会有可见损失(尤其缩放到全屏轮播时)。**建议上线前迁移到 CDN**:
|
||||
|
||||
1. 注册 **腾讯云 COS**(微信小程序配套,国内访问最快)或 **阿里云 OSS**。
|
||||
2. 将 `src/img/` 中的实物照片上传到对象存储。
|
||||
3. 拿到每个图片的 **HTTPS 外链 URL**。
|
||||
4. 修改 `src/utils/productConfig.ts` 中各产品的 `images` 字段,从本地路径 `/img/xxx.jpg` 替换为网络 URL:
|
||||
```ts
|
||||
// 改之前
|
||||
images: ['/img/penbox/The1.jpg']
|
||||
// 改之后
|
||||
images: ['https://your-bucket.cos.ap-guangzhou.myqcloud.com/penbox/The1.jpg']
|
||||
```
|
||||
5. 修改 `config/index.js`,缩小 `copy.patterns` 范围(只 copy icon/占位图等小文件),或直接移除 `src/img` 的 copy 规则,减少构建体积。
|
||||
|
||||
**迁移优点**:
|
||||
- 图片清晰度恢复到原图级别;
|
||||
- 小程序包体积长期保持 < 500KB;
|
||||
- 后续更换产品图只需在图床后台操作,无需重新发版。
|
||||
|
||||
---
|
||||
|
||||
## 下一步开发计划
|
||||
|
||||
### 高优先级
|
||||
|
||||
Reference in New Issue
Block a user