Expo Go中Fast Refresh仅对App.js等上层文件生效如何解决

1. 修正子组件导出写法 #

Fast Refresh 仅支持对具名组件热更，直接导出匿名函数会导致热更失效。
错误示例：

// RepositoryList.jsx 错误写法
export default () => {
  // 组件逻辑
}

正确示例：

// RepositoryList.jsx 正确写法
const RepositoryList = () => {
  // 组件逻辑
}
export default RepositoryList

2. 新增 metro 监听配置 #

在项目根目录新建metro.config.js文件，写入以下配置确保src目录被纳入文件监听范围：

const { getDefaultConfig } = require('expo/metro-config');

const config = getDefaultConfig(__dirname);
config.watchFolders = [...(config.watchFolders || []), `${__dirname}/src`];

module.exports = config;

配置完成后执行npx expo start --clear启动开发服务，清空原有缓存。

3. 修正导入路径大小写 #

Expo 文件监听系统对路径大小写敏感，导入语句中的路径必须和实际文件的大小写完全匹配：

// 错误：文件名首字母大写，导入时小写
import RepositoryList from './repositoryList'
// 正确：和实际文件名一致
import RepositoryList from './RepositoryList'

4. 重置Fast Refresh开关 #

摇一摇打开Expo Go开发菜单，进入设置页关闭Fast Refresh后重新开启，再重启开发服务即可。

内容的提问来源于stack exchange，提问作者Márton Gréczi