React Native开发服务器返回500错误 报reduce未定义错误的原因是什么

报错信息 #

error: TypeError: Cannot read property 'reduce' of undefined
at resolveDependencies (G:\React-Native\Native\chatmat\node_modules\metro\src\DeltaBundler\traverseDependencies.js:411:33)
at processModule (G:\React-Native\Native\chatmat\node_modules\metro\src\DeltaBundler\traverseDependencies.js:140:31)
at async addDependency (G:\React-Native\Native\chatmat\node_modules\metro\src\DeltaBundler\traverseDependencies.js:230:18)
...

错误产生原因 #

该错误由React Native默认打包工具Metro的依赖解析逻辑抛出，常见触发原因如下：

• 项目依赖安装不完整、存在版本冲突，或node_modules目录文件损坏
• 新安装的第三方依赖与当前React Native版本不兼容
• babel.config.js、metro.config.js等工程配置存在语法错误或配置规则不符合要求
• 业务代码中存在错误的导入语句，比如路径拼写错误、导入不存在的模块

解决方案 #

按操作优先级依次尝试：

1. 清空缓存并重新安装依赖（可解决80%以上同类问题）
   Windows环境可在项目根目录依次执行以下命令：

# 删除依赖目录和锁文件
rmdir /s /q node_modules
del package-lock.json yarn.lock
# 重新安装依赖
npm install
# 清空Metro缓存重启开发服务
npx react-native start --reset-cache

Mac/Linux环境执行命令：

# 删除依赖目录和锁文件
rm -rf node_modules package-lock.json yarn.lock
# 重新安装依赖
npm install
# 清空Metro缓存重启开发服务
npx react-native start --reset-cache

2. 排查第三方依赖兼容性
   如果是安装某个新依赖后才出现该错误，先卸载对应依赖验证问题是否解决，再查找安装与当前RN版本匹配的依赖版本即可。
3. 检查工程配置文件
   核对babel.config.js、metro.config.js的配置内容，尤其注意新增的别名配置、模块解析规则是否存在语法错误或逻辑错误。
4. 排查业务代码导入语句
   检查近期修改的代码中的import、require语句，确认导入路径、模块名称没有拼写错误，不存在导入不存在的模块的情况。

内容的提问来源于stack exchange，提问作者JIM