React Native升级+Expo从45升50后JS编译报错求助

报错原因分析 #

这个错误是因为代码中存在非顶级作用域的export声明——比如把export写在了函数、条件判断（if/else）或者块级作用域（{}）内部。Expo 50使用的Hermes引擎或Babel配置对ES模块语法的校验更严格，而Expo 45的旧版本可能允许这种不规范写法。

具体修复步骤 #

• 全局检查export的位置
  用编辑器全局搜索所有export关键字，排查是否有export出现在函数、if语句、循环等块级代码里。比如错误写法：

  function initApp() {
    // 错误：export在函数内部
    export const appConfig = { name: 'MyApp' };
  }
  

  改成顶级作用域导出：

  export const appConfig = { name: 'MyApp' };
  
  function initApp() {
    // ...
  }
  

• 排查第三方依赖兼容性
  即便更新了依赖，部分老旧第三方包可能仍存在不符合ES模块规范的代码：

  1. 临时移除最近添加或未完全更新的依赖，执行npx expo start --clear测试
  2. 用npm ls或yarn list查看依赖树，确认所有依赖版本适配Expo 50
  3. 若某依赖确实存在问题，尝试寻找替代包或向维护者提交issue

• 重置缓存与Babel配置

  1. 执行npx expo start --clear清除Expo缓存
  2. 检查项目根目录的babel.config.js，确保配置符合Expo 50标准：

     module.exports = function(api) {
       api.cache(true);
       return {
         presets: ['babel-preset-expo'],
       };
     };
     

  3. 若自定义了Babel插件，确认插件未破坏ES模块导出规则

• 检查TypeScript配置（若使用TS）
  查看tsconfig.json的module和target字段，建议设置为：

  {
    "compilerOptions": {
      "module": "ESNext",
      "target": "ESNext"
    }
  }
  

  确保TS编译后的代码符合ES模块规范

验证修复 #

修改完成后，执行npx expo prebuild --clean清理旧构建文件，再运行npx expo run:android测试问题是否解决。

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