__fbBatchedBridgeConfig is not set, cannot invoke native modules

Hi,
I’ve tried to create expo app following official guide: https://docs.expo.io/versions/latest/guides/running-in-the-browser
But when I run “expo start --web” I Get error on page: __fbBatchedBridgeConfig is not set, cannot invoke native modules

How can I fix it?

2 Likes

Please ensure you are running in a version of Expo that supports web (SDK 33+) and you have react-native-web, react-dom installed. Also update your expo-cli version.

1 Like

Hi everyone,

I have the same issue as @chirov3. It is a simple repro:

  1. run npx create-react-native-app test-expo-web
  2. choose the expo-template-blank template (also tried the tabs template and got the same result)
  3. run expo run --web
  4. see error on browser

I’m running npm on 6.13.6 and expo-cli on 3.17.24.

P.S.: The expo-cli console prints the following warnings, but they seem unrelated to the actual __fbBatchedBridgeConfig error:

Compiled with warnings.
./node_modules/expo/build/logs/LogSerialization.js
Attempted import error: 'react-native/Libraries/Core/Devtools/symbolicateStackTrace' does not contain a default export (imported as 'symbolicateStackTrace').

./node_modules/react-native/Libraries/Performance/Systrace.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

To give a bit of context on how I ran into this error, I have a mature expo managed project (started on SDK 31) that is currently running SDK 36 perfectly on both android and ios. Product lifecycle now claims for a web version and while following the setup to integrate the web platform to our expo.platforms array on app.json was seamless (thanks to the great docs! :heart:), I got this when I tried to compile with expo start --web:

Failed to compile.
./node_modules/react-native/Libraries/Components/TextInput/TextInputState.js
Module not found: Cannot resolve '../../Utilities/Platform' in './node_modules/react-native/Libraries/Components/TextInput'

Looking into node_modules/react_native folder, I saw that indeed the node_modules/react-native/Libraries/Utilities/Platform.js doesn’t exist, but it has Platform.android.js and Platform.ios.js.

So that’s when I tried to spin up a brand new CRNA managed project hoping to see what those node_modules/react-native files looked like on a web build that could successfully compile so I maybe could figure out which react-native/platform file to use (fixed with patch-package or something else), but ended up having this other __fbBatchedBridgeConfig issue… :slightly_frowning_face:

All help and/or insight into any of these issues would be greatly appreciated. Thanks in advance!

Update to my situation on this issue:

Instead of using CRNA, I tried expo init and it compiles successfully to web in both blank and tab templates. It is interesting though that the TextInput files are exactly the same, where TextInputState.js imports Platform from '../../Utilities/Platform'and that file doesn’t exist.

What’s more is that the second I add a single <TextInput /> component to these working expo init projects and run again with expo start --web, the __fbBatchedBridgeConfig is not set error gets thrown again.

Do you know if react-native core modules such as TextInput and AsyncStorage are supported by expo web compilation @bacon?

Same Here, SDK 38, node 10, node 12, yarn.

Stop working the last expo-cli update.

Update (Magically start working again, after some point expo-cli update)

Getting the same issue. SDK 40, node v10.21.0. Works on the phone but does not work in browser.

Please run expo diagnostics and also post the dependencies section of your package.json.

Also, did you upgrade from an earlier version of Expo or was this newly created using SDK 40?

1 Like

Expo CLI 4.1.4 environment info:
System:
OS: macOS 11.1
Shell: 5.8 - /bin/zsh
Binaries:
Node: 12.18.3 - /usr/local/bin/node
Yarn: 1.22.5 - /usr/local/bin/yarn
npm: 6.14.11 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.9.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 14.4, DriverKit 20.2, macOS 11.1, tvOS 14.3, watchOS 7.2
Android SDK:
API Levels: 23, 26, 27, 28, 29, 30
Build Tools: 27.0.3, 28.0.3, 29.0.3, 30.0.2
System Images: android-27 | Google Play Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom
IDEs:
Android Studio: 4.1 AI-201.8743.12.41.6953283
Xcode: 12.4/12D4e - /usr/bin/xcodebuild
npmPackages:
@expo/webpack-config: ~0.12.45 => 0.12.57
expo: ^40.0.0 => 40.0.1
react: 16.13.1 => 16.13.1
react-dom: 16.13.1 => 16.13.1
react-native: https://github.com/expo/react-native/archive/sdk-40.0.0.tar.gz => 0.63.2
react-native-web: ~0.13.18 => 0.13.18
react-navigation: ^4.4.0 => 4.4.3
npmGlobalPackages:
expo-cli: 4.1.4
Expo Workflow: managed

1 Like

Same Issue on SDK 41.0.1, working on Android but not on web

Expo CLI 4.4.7 environment info:
System:
OS: Linux 5.11 Fedora 34 (Workstation Edition) 34 (Workstation Edition)
Shell: 5.8 - /usr/bin/zsh
Binaries:
Node: 12.22.1 - /usr/bin/node
npm: 7.12.1 - /usr/bin/npm
npmPackages:
expo: ~41.0.1 => 41.0.1
react: 16.13.1 => 16.13.1
react-dom: 16.13.1 => 16.13.1
react-native: https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz => 0.63.2
react-native-web: ~0.13.12 => 0.13.18
npmGlobalPackages:
expo-cli: 4.4.7
Expo Workflow: managed

this happens if the react-native → react-native-web alias is not working, so instead of importing react-native-web on web you’re importing react-native. perhaps webpack is misconfigured in your project or your app code or some library that you are using depends on a deep import into react-native, like :react-native/some-internal-library

That’s weird, the only dependencies I added are:

  • aws-amplify
  • aws-amplify-react-native
  • react-native-elements
  • react-native-paper
    (all of them using the expo install command). Also, I do not have any webpack configuration. The project was created from crash using the option: tabs (TypeScript)

Here’s the package.json I have:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject",
    "test": "jest --watchAll"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/vector-icons": "^12.0.0",
    "@react-native-community/masked-view": "0.1.10",
    "@react-navigation/bottom-tabs": "5.11.2",
    "@react-navigation/native": "~5.8.10",
    "@react-navigation/stack": "~5.12.8",
    "amazon-cognito-identity-js": "^5.0.1",
    "aws-amplify": "^4.0.2",
    "aws-amplify-react-native": "^5.0.0",
    "expo": "~41.0.1",
    "expo-asset": "~8.3.1",
    "expo-constants": "~10.1.3",
    "expo-font": "~9.1.0",
    "expo-linking": "~2.2.3",
    "expo-splash-screen": "~0.10.2",
    "expo-status-bar": "~1.0.4",
    "expo-web-browser": "~9.1.0",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz",
    "react-native-elements": "^3.4.1",
    "react-native-gesture-handler": "~1.10.2",
    "react-native-paper": "^4.8.1",
    "react-native-reanimated": "~2.1.0",
    "react-native-safe-area-context": "3.2.0",
    "react-native-screens": "~3.0.0",
    "react-native-web": "~0.13.12"
  },
  "devDependencies": {
    "@babel/core": "^7.9.0",
    "@types/react": "~16.9.35",
    "@types/react-native": "~0.63.2",
    "jest-expo": "~41.0.0",
    "typescript": "~4.0.0"
  },
  "private": true
}

sorry we can’t help much beyond telling you that’s the source of the problem, you can dig in to try to find out why it’s happening in your case! if you’re not sure where to start, this may be useful: https://expo.fyi/manual-debugging

Thanks. Looks like the issue is with the react-native/Libraries/NewAppScreen. After removing it, the application is working fine :slight_smile:

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.