88 lines
2.8 KiB
Markdown
88 lines
2.8 KiB
Markdown
# H5 → 微信小程序迁移文档
|
||
|
||
> 完整的迁移规范、技术换算、交互改造指南
|
||
> 最后更新：2026-03-17
|
||
|
||
---
|
||
|
||
## 📚 文档结构
|
||
|
||
### 主规范文档
|
||
**[`h5-to-mp-bridge.md`](./h5-to-mp-bridge.md)** - 完整迁移规范（1081行）
|
||
|
||
包含：
|
||
- **§1-4**：执行规程（输入输出、强制决策、能力分级）
|
||
- **§5-9**：技术换算（Spacing、字号、颜色、布局、装饰）
|
||
- **§10-12**：交互改造（WXML映射、数据驱动、API替换）
|
||
- **§13**：10步标准流程
|
||
- **§14**：附录索引
|
||
|
||
### 附录文档
|
||
**[`appendix/`](./appendix/)** - 详细字典
|
||
|
||
- [`index.md`](./appendix/index.md) - 附录索引
|
||
- [`spacing-dictionary.md`](./appendix/spacing-dictionary.md) - Spacing与尺寸字典（181行）
|
||
- [`typography-dictionary.md`](./appendix/typography-dictionary.md) - 字体与文本字典（267行）
|
||
- [`color-dictionary.md`](./appendix/color-dictionary.md) - 颜色字典（199行）
|
||
- [`layout-dictionary.md`](./appendix/layout-dictionary.md) - 布局类映射字典（205行）
|
||
|
||
---
|
||
|
||
## 🎯 使用指南
|
||
|
||
### 对于 AI 代码生成
|
||
|
||
**推荐流程**：
|
||
1. 先查阅 [`../QUICK-REFERENCE.md`](../QUICK-REFERENCE.md)（快速参考）
|
||
2. 需要详细说明时，加载本文档 [`h5-to-mp-bridge.md`](./h5-to-mp-bridge.md)
|
||
3. 查表时参考 [`appendix/`](./appendix/) 中的详细字典
|
||
|
||
### 对于开发者
|
||
|
||
**推荐流程**：
|
||
1. 阅读 [`h5-to-mp-bridge.md`](./h5-to-mp-bridge.md) 的 §1-4（执行规程）
|
||
2. 了解输入输出契约和强制决策
|
||
3. 按 §13 的 10 步标准流程执行
|
||
4. 查表时参考 §5-9 和 [`appendix/`](./appendix/)
|
||
|
||
---
|
||
|
||
## 🔑 核心要点
|
||
|
||
### 1. 单位策略
|
||
- **rpx 为主**：布局、容器、间距
|
||
- **px 为辅**：发丝线、阴影、小图标
|
||
- **换算公式**：`rpx = px × 1.8204`
|
||
|
||
### 2. line-height 关键发现 ⚠️
|
||
- 微信小程序的 `<text>` 组件不能直接设置 `line-height`
|
||
- 必须在外层 `<view>` 上设置，text 会自动继承
|
||
- 详见主规范 §2.6 和 §6.2
|
||
|
||
### 3. 数据驱动
|
||
- 禁止使用 DOM 操作（`document.*`、`element.classList.*`）
|
||
- 所有交互改为 `setData` + 条件渲染
|
||
- 详见主规范 §11
|
||
|
||
### 4. 能力分级
|
||
- **A 类**：可直接使用（flex、transition、animation 等）
|
||
- **B 类**：有条件使用（sticky、grid、backdrop-filter 等）
|
||
- **C 类**：禁止直迁（DOM API、浏览器 API 等）
|
||
- 详见主规范 §3
|
||
|
||
---
|
||
|
||
## 📖 快速链接
|
||
|
||
- [完整迁移规范](./h5-to-mp-bridge.md)
|
||
- [附录索引](./appendix/index.md)
|
||
- [Spacing 字典](./appendix/spacing-dictionary.md)
|
||
- [字体字典](./appendix/typography-dictionary.md)
|
||
- [颜色字典](./appendix/color-dictionary.md)
|
||
- [布局字典](./appendix/layout-dictionary.md)
|
||
- [返回总索引](../README.md)
|
||
|
||
---
|
||
|
||
**版本**：v3.0 | **最后更新**：2026-03-17
|