Expo新建项目添加导航模板遇Babel异步运行支持错误求助

问题分析 #

你遇到的错误提示核心是Babel在同步运行模式下检测到了原生ESM模块配置，但你的babel.config.js本身是标准CommonJS格式（使用module.exports），所以问题大概率来自缓存过期、依赖版本不兼容或隐性配置冲突。

解决方案步骤 #

1. 清除Expo缓存
   这是解决这类缓存相关Babel错误的首选方案，运行命令：

   npx expo start --clear
   

2. 升级@babel/core到兼容版本
   当前你使用的@babel/core@7.20.0与Expo 49存在兼容风险，升级到官方推荐的版本：

   npm install @babel/core@^7.22.0 --save-dev
   

3. 确认组件导出语法一致性
   检查screens/LoginScreen.js和screens/RegisterScreen.js的导出方式，确保使用export default：

   // 示例LoginScreen.js
   import React from 'react';
   import { View, Text } from 'react-native';
   
   const LoginScreen = () => {
     return <View><Text>Login</Text></View>;
   };
   
   export default LoginScreen;
   

   如果使用命名导出（export const LoginScreen = () => {}），需同步修改导入语句为import { LoginScreen } from "../screens/LoginScreen";。

4. 清理冗余Babel配置文件
   确保项目根目录下仅保留babel.config.js，删除.babelrc、babel.config.mjs等其他可能引发冲突的配置文件。

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