Search code examples
javascriptreact-nativeexpoasyncstorage

using expo and @react-native-community/async-storage

I'm using expo to build and bundle my app. I've added @react-native-async-storage/async-storage but I get the following error on console:

Failed building JavaScript bundle.
Unable to resolve "@react-native-async-storage/async-storage" from "src/components/Message/Message.js"

my device also show multiple steps that might help to solve it as can be seen here enter image description here

but unfortunately it didn't solve it. I also tried:

  • to clean expo cache folder from ~/.expo/
  • remove-re-install the Expo Client app
  • clear the metro bundler cache in /tmp folder

I must say that when checking the node_modules folder, I've noticed that the package is installed under @react-native-community folder and not under @react-native-async-storage - but I can't be sure how those links magically happening under the hood, but maybe it worth to mention.

I saw in @react-native-async-storage/async-storage docs that I need to run another pod install command but In expo the platform-specific folder is not accisible and the command runs without doing anything. Moreover, I've conducted expo snack example but it functions properly. So probably something in my env or missing some configuration?

Any ideas?

Env details:

"expo": "^38.0.0",
"expo-cli": "3.27.6",
"react-native": "https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz",
"@react-native-community/async-storage": "~1.11.0",
Solution

  • Instead of importing from @react-native-async-storage/async-storage in your Message.js file try importing @react-native-community/async-storage.

    This is the package you've installed, it was correctly installed under @react-native-community directory in node_modules as you noticed.

    -import AsyncStorage from '@react-native-async-storage/async-storage';
+import AsyncStorage from '@react-native-community/async-storage';