M1芯片Mac下Ionic Capacitor iOS应用仅模拟器白屏如何解决

该问题是M1芯片arm64架构与Xcode 13.x版本、低版本Capacitor的模拟器WebView加载逻辑不兼容导致：真机本身为arm架构，资源加载校验逻辑和Intel模拟器一致，因此运行正常；M1原生模拟器的WebView对本地资源路径的校验规则更新，旧版Capacitor的资源寻址逻辑无法匹配，导致闪屏结束后加载不到前端资源出现白屏。

解决方案 #

按照以下优先级尝试修复：

• 升级Capacitor到3.4.0及以上正式版本，该版本已官方修复M1模拟器兼容问题，执行命令：
  npm install @capacitor/core@latest @capacitor/ios@latest
• 清理全链路缓存并重新同步项目：
  1. 删除ios/App目录下的Pods文件夹和Podfile.lock文件
  2. 执行Angular生产打包命令：ng build --prod
  3. 同步Capacitor资源到iOS项目：npx cap sync ios
  4. 进入ios目录执行依赖安装：pod install --repo-update
  5. 打开Xcode执行Shift + Command + K清理构建缓存后重新运行模拟器
• 临时兼容方案（不建议长期使用）：
  打开Xcode顶部菜单Product → Scheme → Edit Scheme → Run → Options，找到Architecture选项，勾选Open using Rosetta，通过转译模式运行模拟器即可正常加载资源，该方案会导致模拟器运行性能下降。

额外注意事项 #

检查Angular项目angular.json配置中的outputPath字段，需确保打包输出目录为www，和Capacitor默认读取的前端资源路径保持一致，自定义路径也会导致资源加载失败出现白屏。

内容的提问来源于stack exchange，提问作者Shishir R Patil