1

tools/h5-to-mp-checker/EXAMPLES.md

@@ -0,0 +1,104 @@
+# 使用示例
+
+## 快速开始
+
+```bash
+# 从项目根目录运行
+cd c:\NeoZQYY
+
+# 检查 board-customer 页面
+python tools\h5-to-mp-checker\check_h5_to_mp.py ^
+  --h5 docs\h5_ui\pages\board-customer.html ^
+  --wxss apps\miniprogram\miniprogram\pages\board-customer\board-customer.wxss ^
+  --output docs\miniprogram-dev\board-customer-reports\auto-check-report.md
+```
+
+## 输出示例
+
+运行后会生成类似这样的报告：
+
+```markdown
+# H5 到小程序样式对比报告
+
+> 生成时间：2026-03-14 07:36:00
+
+## 📊 问题统计
+
+- ❌ 严重问题：2 个
+- ⚠️ 警告：3 个
+- ℹ️ 提示：1 个
+- **总计**：6 个
+
+## ❌ 严重问题（2 个）
+
+### ❌ 严重 page - line-height
+
+- **位置**：page 全局样式
+- **H5 值**：无全局设置
+- **应该是**：无
+- **实际是**：1.5
+- **差异**：100.0%
+
+### ❌ 严重 text-xs - line-height
+
+- **位置**：.assistant-label
+- **H5 值**：16px
+- **应该是**：29rpx
+- **实际是**：缺失
+- **差异**：100.0%
+```
+
+## 集成到开发流程
+
+### 1. 提交前检查
+
+```bash
+# 添加到 pre-commit hook
+python tools\h5-to-mp-checker\check_h5_to_mp.py --h5 ... --wxss ... --output report.md
+if [ $? -ne 0 ]; then
+  echo "样式检查失败，请修复后再提交"
+  exit 1
+fi
+```
+
+### 2. CI/CD 集成
+
+```yaml
+# .github/workflows/check-styles.yml
+name: Check Styles
+on: [push, pull_request]
+jobs:
+  check:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - name: Check styles
+        run: |
+          python tools/h5-to-mp-checker/check_h5_to_mp.py \
+            --h5 docs/h5_ui/pages/board-customer.html \
+            --wxss apps/miniprogram/miniprogram/pages/board-customer/board-customer.wxss \
+            --output report.md
+      - name: Upload report
+        uses: actions/upload-artifact@v2
+        with:
+          name: style-check-report
+          path: report.md
+```
+
+## 更多页面
+
+检查其他页面：
+
+```bash
+# 检查 board-coach 页面
+python tools\h5-to-mp-checker\check_h5_to_mp.py ^
+  --h5 docs\h5_ui\pages\board-coach.html ^
+  --wxss apps\miniprogram\miniprogram\pages\board-coach\board-coach.wxss ^
+  --output docs\miniprogram-dev\board-coach-reports\auto-check-report.md
+
+# 检查 board-finance 页面
+python tools\h5-to-mp-checker\check_h5_to_mp.py ^
+  --h5 docs\h5_ui\pages\board-finance.html ^
+  --wxss apps\miniprogram\miniprogram\pages\board-finance\board-finance.wxss ^
+  --output docs\miniprogram-dev\board-finance-reports\auto-check-report.md
+```