Windows + WSL React Native 开发全流程最佳实践

一、环境搭建(一次性配置)

1.1 WSL2 与基础工具链

1. PowerShell 中执行
wsl --install && wsl --set-default-version 2

1. 在 WSL (Ubuntu) 内安装 nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
source ~/.bashrc
nvm install --lts && nvm use --lts

1. 安装 Git
sudo apt-get install git

核心原则:所有开发工具链(Node、npm、Git、Expo CLI)必须安装在 WSL 内部,避免 Windows 路径污染导致 Metro Bundler 异常 。

1.2 Android 环境(本地测试闭环)

  • Windows 侧:安装 Android Studio(非 C 盘)和 Java 17
  • 配置系统变量:
  ANDROID_HOME = D:\Android\Sdk
  Path 追加 %ANDROID_HOME%\platform-tools
  • WSL 侧:只需安装 ADB 客户端
  sudo apt-get install android-tools-adb
  adb start-server  # 连接 Windows 侧 ADB 服务

说明:Android 编译、模拟器、真机调试可完全在 Windows/WSL 本地完成,无需云端。

1.3 iOS 环境(不可本地)

WSL 无法运行 Xcode 或 iOS 模拟器。所有 iOS 测试必须依赖:

  • Expo Go App(JS 层预览)
  • EAS 云端构建(真机原生测试)
  • 云真机服务(可选验证)

二、开发测试阶段(核心限制详解)

2.1 可测试的范围(Expo Go)

以下功能在 Expo Go 中可实时热更新测试:

  • React 组件、JS 业务逻辑、网络请求
  • Expo SDK 内置模块:相机、相册、定位、传感器、SQLite、Asset 等
  • 第三方纯 JS 库:axios、lodash、redux 等

2.2 不可测试的原生模块(iOS & Android)

iOS 专属限制:

  • 推送通知(APNs):Expo Go 无法注册设备 Token,无法接收生产/测试推送
  • 原生 UI 组件:自定义 Objective-C/Swift 组件(如自定义地图、图表)
  • 后台任务:UIBackgroundModes(后台定位、音频播放、数据同步)
  • Keychain 存取:安全存储密码、证书,Expo Go 的沙盒无法访问
  • App Groups / Widget:与主 App 共享数据、桌面小组件
  • 私有 API:如 IAP 内购、Apple Pay、Sign in with Apple
  • 硬件深度集成:蓝牙 BLE 高级功能、NFC 后台读取

Android 专属限制:

  • 第三方厂商推送:华为 Push、小米 Push、OPPO Push(需集成原生 SDK)
  • 自定义原生模块:用 Java/Kotlin 写的模块(如支付宝 SDK、指纹识别封装)
  • 后台服务:ForegroundServiceWorkManager 保活任务
  • 系统级权限:SYSTEM_ALERT_WINDOW(悬浮窗)、WRITE_SECURE_SETTINGS
  • Root 设备检测:安全支付、防作弊逻辑
  • 多进程:运行在不同进程的原生服务

双平台共同限制:

  • 原生代码热更新:修改 android/ios/ 目录代码后,必须重新构建原生包(npx expo prebuild
  • 性能调试:Expo Go 的沙盒性能与生产包差异大,无法准确测试启动时间、内存占用

三、真机测试方案(生产环境验证)

3.1 Android(本地闭环)

1. 生成内测 APK
eas build --platform android --profile preview --local

1. 或本地生成(需配置 Gradle)
cd android && ./gradlew assembleRelease

分发:通过 Firebase App Distribution、蒲公英或直接发送 APK。

3.2 iOS(必须云端)

1. 云端构建 TestFlight 包
eas build --platform ios --profile production

1. 自动提交到 TestFlight
eas submit --platform ios

测试:在 App Store Connect 添加内部测试员,通过 TestFlight App 安装。

验证清单:

  • ✅ 推送通知能否收到
  • ✅ 后台定位是否持续
  • ✅ IAP 内购流程
  • ✅ App 冷启动时间 < 2 秒

四、打包上架(EAS 云原生)

4.1 配置 eas.json

{
  "build": {
    "production": {
      "android": {"buildType": "app-bundle"},
      "ios": {"distribution": "app-store"}
    }
  },
  "submit": {
    "production": {
      "ios": {"appleId": "your-apple-id@example.com"},
      "android": {"serviceAccountKeyPath": "./play-api-key.json"}
    }
  }
}

4.2 一键发布

1. 双平台构建 + 提交
eas build --platform all --profile production --auto-submit

流程:WSL 发指令 → Expo 云端编译 → 生成 .ipa.aab → 自动上传商店 → 人工填写元数据 → 等待审核。


五、核心风险:账号身份隔离详解

5.1 什么是账号身份隔离?

账号身份隔离 = 让 Apple/Google 认为每个开发者账号对应一个完全独立的“法律实体”,避免被判定为“关联账号”而批量封禁。

Apple 会在 40+ 维度交叉比对,一旦匹配 3–5 项,新账号立即被标记为“高风险”。

5.2 隔离的 5 大维度

维度 苹果如何追踪 隔离方案
支付信息 信用卡 BIN、账单地址、D-U-N-S 编码 一卡一号,实体卡 > 虚拟卡;账单地址与 IP 国家一致
网络 IP 提交包的 IP 段、DNS 服务器 家庭宽带 > 手机热点;禁用 VPN/机场;不同账号切换宽带
设备指纹 打包 Mac 的硬件 UUID、EFI 签名 EAS 云端构建可规避;若用物理 Mac,一机一号,抹盘重装
开发者身份 姓名、电话、邮箱、护照号 不同账号用不同法人、不同手机号、不同域名邮箱
元数据 Bundle ID、App 名称、截图、代码哈希 马甲包需改类名、资源哈希、第三方 SDK Key;避免视觉相似

5.3 隔离的极端场景

场景:旧账号因违规被 Apple 封禁,想用新账号重新上架同款 App。

必须更换:

  • ✅ 信用卡(不能是同一张副卡)
  • ✅ 账单地址(不能是同一街道门牌号)
  • ✅ 手机号(不能是同一运营商号段)
  • ✅ 网络环境(不能是同一 Wi-Fi)
  • ✅ 电脑(不能是同一台 Mac 主板)
  • ✅ 代码(类名、资源文件 MD5 必须改变)
  • ✅ 第三方服务(Firebase、Umeng、微信开放平台 AppKey 必须新申请)

可保留:

  • ❌ 源码逻辑(业务逻辑不变,但需混淆)
  • ❌ 设计稿(UI 可微调,避免像素级抄袭)

六、常见问题排坑

6.1 Expo Go 连接失败

1. WSL2 获取 IP
ip addr | grep eth0

1. 强制 Metro 监听所有网络接口
expo start --host lan

6.2 EAS 构建失败

错误:Unable to resolve module @some/native-module
原因:使用了非 Expo 管理的原生依赖
解决:npx expo prebuild 生成原生代码,再 eas build

6.3 Apple 审核被拒

  • 4.3 重复 App:马甲包需深度混淆,避免与其他账号 App 视觉相似
  • 5.1.1 内购:虚拟商品必须用 IAP,否则直接下架
  • 2.5.2 私有 API:Expo 已屏蔽,但自定义原生模块需自检

6.4 Google Play 下架风险

  • 权限滥用:不要申请 READ_PHONE_STATE 等高危权限
  • 数据安全:必须提供隐私政策,且与 App 行为一致

七、一句话总结

Windows + WSL + Expo 实现了技术链路的完全闭环,但 iOS 原生模块测试必须依赖云端;真正的生死门槛是“账号身份隔离”,把每个开发者账号当作独立公司运营,才能避免“一人违规,全家连坐”。

暂无评论

发送评论 编辑评论

|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇