解决create-t3-turbo项目中Expo Android模拟器加载失败问题

问题背景

在使用create-t3-turbo项目时，许多开发者在尝试通过Android模拟器运行Expo应用时遇到了加载失败的问题。错误信息显示为"Java.Lang.Exception: Failed to load all assets"，这表明应用在启动时无法正确加载所需的资源文件。

问题表现

开发者报告的主要症状包括：

• 应用在Android模拟器上启动失败
• 控制台显示资源加载异常
• 错误信息指向expo-router模块无法解析
• 检查发现apps/expo/node_modules目录为空

根本原因分析

经过深入排查，发现问题主要源于以下两个因素：

1. 模块解析路径错误：项目配置中指定了"main": "expo-router/entry"作为入口，但Metro打包工具无法在预期位置找到该模块。

2. node_modules目录结构异常：由于项目使用了monorepo结构，依赖模块安装在根目录的node_modules中，而Expo应用期望在其自身的node_modules目录中找到依赖。

解决方案

方法一：创建符号链接（推荐）

在项目根目录执行以下命令，创建从apps/expo/node_modules到根node_modules的符号链接：

ln -s ./node_modules apps/expo/node_modules

这种方法保持了项目原有的配置不变，是最接近预期工作状态的解决方案。

方法二：修改入口配置

1. 修改apps/expo/package.json文件，将main属性从：

"main": "expo-router/entry"

改为：

"main": "index.js"

2. 在apps/expo目录下创建index.js文件，内容为：

import 'expo-router/entry'

3. 重新启动Expo开发服务器

技术原理

这两种解决方案都解决了模块解析路径的问题：

• 符号链接方法：通过创建符号链接，使Expo应用能够访问安装在根目录的node_modules中的依赖，同时保持了项目结构的完整性。

• 入口修改方法：通过显式指定入口文件，绕过了Metro打包工具对expo-router/entry的直接解析，使其能够正确找到模块位置。

最佳实践建议

1. 对于monorepo项目，建议优先考虑符号链接方案，因为它更符合模块解析的预期行为。

2. 定期清理node_modules和缓存文件，特别是在切换解决方案后：

rm -rf node_modules apps/expo/node_modules
pnpm install
expo start -c

3. 确保开发环境一致性，包括：
   • Node.js版本（推荐LTS版本）
   • 包管理器版本（pnpm/npm/yarn）
   • Android模拟器配置

总结

create-t3-turbo项目中Expo Android模拟器加载失败问题主要源于monorepo结构下的模块解析路径配置。通过创建符号链接或调整入口配置，开发者可以顺利解决这一问题。理解这两种解决方案背后的原理，有助于开发者在类似场景下快速定位和解决问题。