Expo 46升级至47后出现new !(function语法错误的修复方法

错误信息 #

Uncaught SyntaxError: expected expression, got '!'

问题代码 #

排查后发现错误来自这段webpack生成的异常代码：

var nativeEventEmitter = new !(function webpackMissingModule() { 
  var e = new Error("Cannot find module 'react-native-web/dist/exports/NativeEventEmitter'");
  e.code = 'MODULE_NOT_FOUND'; 
  throw e; 
}())();

原因分析 #

这段代码是webpack找不到指定模块时生成的占位代码，但new !(function...)()存在语法错误——new关键字后必须跟合法的构造函数或类，!运算符在这里直接破坏了语法结构。本质原因是Expo 47升级后，react-native-web模块的依赖路径或版本兼容性出现了不匹配。

解决步骤 #

• 清理依赖并重新安装

  rm -rf node_modules package-lock.json yarn.lock
  npm install
  

• 锁定兼容的react-native-web版本
  Expo 47对应的react-native-web稳定版本为~0.18.9，手动安装确保版本匹配：

  npm install react-native-web@~0.18.9 --save
  

• 清除Expo缓存

  npx expo start --clear
  

• 检查第三方库兼容性
  如果项目中使用了依赖react-native-web的第三方库，确认该库是否支持Expo 47，必要时更新第三方库到最新兼容版本。
• 校验babel配置
  确保babel-preset-expo版本与Expo 47匹配（应为~9.2.0），更新后重新执行构建。

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