[@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.
stcdh opened this issue · 43 comments
What happened?
Just to be clear, I have reviewed every search and article I can find on this topic. I am working on just the Android app to get some underlying issues updated in Android Studio. This is just a relatively simple flashcard-type app.
I have cleaned, rebuilt, and run through every fix I can find.
I'm getting the error:
`Error: [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.
To fix this issue try these steps:
• Rebuild and restart the app.
• Run the packager with `--reset-cache` flag.
• If you are using CocoaPods on iOS, run `pod install` in the `ios` directory and then rebuild and re-run the app.
• If this happens while testing with Jest, check out docs how to integrate AsyncStorage with it: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest
If none of these fix the issue, please open an issue on the Github repository: https://github.com/react-native-async-storage/async-storage/issues`
I followed the above to the letter. I have deleted and added the app back both on the emulator and a physical device. I also created the .apk and ran it on my phone just to make sure it wasn't a jest issue.
I'll include the relevant files & commands below, but please let me know if you need more information somewhere:
Version
1.18.1
What platforms are you seeing this issue on?
- Android
- iOS
- macOS
- Windows
- web
System Information
System:
OS: Windows 10 10.0.22621
CPU: (12) x64 12th Gen Intel(R) Core(TM) i7-1265U
Memory: 2.74 GB / 15.64 GB
Binaries:
Node: 18.16.0 - C:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm: 9.6.6 - ~\AppData\Roaming\npm\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK: Not Found
IDEs:
Android Studio: AI-222.4459.24.2221.9971841
Visual Studio: Not Found
Languages:
Java: 11.0.19 - C:\Program Files\Amazon Corretto\jdk11.0.19_7\bin\javac.EXE
npmPackages:
@react-native-community/cli: Not Found
react: Not Found
react-native: Not Found
react-native-windows: Not Found
npmGlobalPackages:
*react-native*: Not Found
Steps to Reproduce
Firstly, I installed the package with NPM:
npm install @react-native-async-storage/async-storage
package.json:
{ "name": "Name", "version": "0.0.1", "private": true, "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", "test": "jest" }, "dependencies": { "@react-native-async-storage/async-storage": "^1.18.1", "deprecated-react-native-prop-types": "^4.1.0", "native-base": "^2.13.12", "react": "18.2.0", "react-native": "0.71.8", "react-native-firebase": "^5.6.0", "react-native-swiper": "^1.6.0" }, "devDependencies": { "babel-jest": "29.5.0", "jest": "29.5.0", "jetifier": "^2.0.0", "metro-react-native-babel-preset": "0.76.5", "react-test-renderer": "18.2.0" }, "jest": { "preset": "react-native", "setupFiles": [ "./jest/jestSetupFile.js" ] } }
^ Just one note on the above, I did try upgrading native-base as well.
Deck.js
import React from 'react' import { Platform, Image, Dimensions, TouchableOpacity, View, Animated, StyleSheet } from 'react-native' import { Card, CardItem, Icon, Container, Header, Body, Footer, Left, Right, Content, Title, List, ListItem, Text, Button } from 'native-base' import Swiper from 'react-native-swiper' import firebase from 'react-native-firebase' import AsyncStorage from '@react-native-async-storage/async-storage';
I can provide more code if needed, but when I comment out the above import, the app functions. If I include the import from Native base, I get the removal notification, and if I simply comment out the AsyncStorage, the app otherwise functions with the AsyncStorage functionality.
I ran two different codes in my jestSetupFile, the suggested one here: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest and the current one:
jest.mock("@react-native-async-storage/async-storage", () => ({ setItem: jest.fn(() => Promise.resolve()), getItem: jest.fn(() => Promise.resolve()), }));
I also went the mocks_ directory route.
Are there any other suggestions?
I am Facing the same issue
Hey,
Did you try running it on fresh project? Most of the time, the issue is related to project-specific setup. I just ran RN 71.8 with Async Storage with no issue
@krizzu Thanx for your time,Actually i was not clear enough,it is working in project but fails in below test case
CODE ::
import 'react-native';
import React from 'react';
import App from '../App';
// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';
// import { render, screen } from '@testing-library/react-native';
// import debugDeep from '@testing-library/react-native/build/helpers/debugDeep';
import PharmaLynkProductList from '../src/screens/PharmaLynkProductList';
import { store } from '../src/redux';
import { Provider } from 'react-redux';
import { render } from '@testing-library/react-native';
// it('renders correctly', () => {
// renderer.create();
// });
// test("Testing first time",() => {
// expect(true).toBe(false);
// })
test("Welcome Screen from App.js", () => {
function Wrapper({ children }) {
return <Provider store={store}>{children}</Provider>
}
render(<PharmaLynkProductList/>,{ wrapper : Wrapper });
});
RESULT ::
FAIL tests/App-test.tsx
● Test suite failed to run
[@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.
To fix this issue try these steps:
• Rebuild and restart the app.
• Run the packager with `--reset-cache` flag.
• If you are using CocoaPods on iOS, run `pod install` in the `ios` directory and then rebuild and re-run the app.
• If this happens while testing with Jest, check out docs how to integrate AsyncStorage with it: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest
If none of these fix the issue, please open an issue on the Github repository: https://github.com/react-native-async-storage/async-storage/issues
4 | import {createStore, combineReducers, applyMiddleware} from 'redux';
5 | import productsReducers from '../redux/reducers/Product';
> 6 | import AsyncStorage from '@react-native-async-storage/async-storage';
| ^
7 | import {persistStore, persistReducer} from 'redux-persist';
8 | import {PersistGate} from 'redux-persist/integration/react';
9 |
at Object.<anonymous> (node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.native.ts:23:9)
at Object.require (node_modules/@react-native-async-storage/async-storage/lib/commonjs/index.ts:1:1)
at Object.require (src/redux/index.js:6:1)
at Object.require (__tests__/App-test.tsx:14:1)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 2.632 s
Ah, that changes the issue completely 😄
Try this:
https://react-native-async-storage.github.io/async-storage/docs/advanced/jest
@krizzu Already did bro but no it doesn't work 🥲
@krizzu Already did bro but no it doesn't work 🥲
And i have tried with both ways
"dependencies": {
"@gorhom/bottom-sheet": "^4.4.6",
"@likashefqet/react-native-image-zoom": "^1.3.0",
"@notifee/react-native": "^7.4.0",
"@react-native-async-storage/async-storage": "^1.15.17",
"@react-native-firebase/app": "^12.3.0",
"@react-native-firebase/messaging": "^12.3.0",
"@react-native-masked-view/masked-view": "^0.2.6",
"@react-navigation/drawer": "^6.5.8",
"@react-navigation/native": "^6.0.6",
"@react-navigation/native-stack": "^6.9.12",
"@react-navigation/stack": "^6.0.11",
"@stripe/stripe-react-native": "^0.23.1",
"axios": "^1.3.3",
"immutability-helper": "^3.1.1",
"moment": "^2.29.1",
"react": "18.2.0",
"react-native": "0.71.0",
"react-native-blob-util": "^0.17.3",
"react-native-bootsplash": "^4.4.1",
"react-native-charts-wrapper": "^0.5.11",
"react-native-gesture-handler": "^2.4.2",
"react-native-image-pan-zoom": "^2.1.12",
"react-native-keyboard-aware-scroll-view": "^0.9.5",
"react-native-maps": "^1.4.0",
"react-native-otp-textinput": "^0.0.9",
"react-native-otp-verify": "^1.0.5",
"react-native-pager-view": "^5.4.25",
"react-native-pdf": "^6.6.2",
"react-native-reanimated": "^2.8.0",
"react-native-reanimated-carousel": "^3.3.2",
"react-native-rename": "^3.2.7",
"react-native-responsive-screen": "^1.4.2",
"react-native-safe-area-context": "^4.2.5",
"react-native-screens": "^3.13.1",
"react-native-simple-toast": "^1.1.3",
"react-native-splash-screen": "^3.3.0",
"react-native-tab-view": "^3.1.1",
"react-native-uuid": "^2.0.1",
"react-native-webview": "^11.16.0",
"react-redux": "^7.2.6",
"redux": "^4.1.2",
"redux-persist": "^6.0.0",
"redux-thunk": "^2.4.1"
},
I change the import from import AsyncStorage from '@react-native-async-storage/async-storage' TO
import AsyncStorage from '@react-native-async-storage/async-storage/jest/async-storage-mock'
😀Working Fine Now Thanx ✌🏻
Great!
I realized the OP did not response yet, so reopening
Same issue happened with me, been creating fresh new project with typescript since last week and this issue happens right the moment i installed this package
My environment, maybe we can see some pattern here:
"react": "18.2.0",
"react-native": "0.71.8",
"@react-native-async-storage/async-storage": i actually first tried 1.18.1 and the problem persist, tried uninstalled it using npm uninstall then installed v1.16.0, problem still exist
Last time it worked was in my last old RN project below, without typescript
"react": "17.0.1",
"react-native": "0.64.2",
"@react-native-async-storage/async-storage": "^1.15.5",
Krysztof, thanks. I will try a new project. I had cleaned out node_modules multiple times, to no avail, but I had not tried a completely new project. I will report back later today on the effort. Thanks,
…
On Wed, May 31, 2023 at 8:40 AM Krzysztof Borowy @.> wrote: I realized the OP did not response yet, so reopening — Reply to this email directly, view it on GitHub <#967 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AOQ5AMGLQGSAE667A5RTNHLXI432FANCNFSM6AAAAAAYR6A3AQ . You are receiving this because you authored the thread.Message ID: @. com>
-- Denver Hunter Small Town Co., LLC Websites & data experiences that sell. P: 803.939.6694
please let me know how it went by initiating fresh new project. because i did it several days ago and no avail
idk if i init fresh new one and straight up installs RNC/AsyncStorage v1.15 instead of fresh install with 1.18 and downgrading (which didn't work for me)
win 11 Ract native 0.67.5 node 14
Hello,
I have the same error [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.
It's working on Android but not on IOS, my app was working before, I don't understand
"@react-native-async-storage/async-storage": "^1.17.11",
fix : download one version older from the latest one it will work fine without any errors
This issue has been marked as stale due to inactivity. Please respond or otherwise resolve the issue within 7 days or it will be closed.
Same issue here tried multiple versions can't make it work.
Im running my app on an expo development build..
@TahirPK007 Which version are you using?
I face the same problem with Andriod, but it works with iOS.
My package.json info below:
"@react-native-async-storage/async-storage": "^1.19.3",
"react": "18.2.0",
"react-native": "0.72.5",
I'm also facing the same issue.
still facing the same issue on the expo. anyone have any idea
Same. problem here with expo. I am using amplify and getting the error in Jest testing. None of the suggested solution works.
This issue has been marked as stale due to inactivity. Please respond or otherwise resolve the issue within 7 days or it will be closed.
Joining the club.
Same issue here..
try that #994 (comment)
kill (remove on backend service) app installed on the simulator before and reinstall the app, and then it works!
Please try rebuilding the application once you install the package and set it up in your repository.
It should work out of the box, with the new build.
quit react-native in terminal,then restart with "npm run start --reset-cache".It works for me!
quit react-native in terminal,then restart with "npm run start --reset-cache".It works for me!
you could just stop in quit react-native
try that #994 (comment)
kill (remove on backend service) app installed on the simulator before and reinstall the app, and then it works!
works for me. Thansk!
This issue has been marked as stale due to inactivity. Please respond or otherwise resolve the issue within 7 days or it will be closed.
I'm having this issue now.
I'm having this issue now.
Ugh! Here was the fix.
I'm having this issue now.
Ugh! Here was the fix.
Same here. This was finally the fix. Using expo, deleting the dev build on my device and re-running expo start
Hey. @jessemcintire. I Installed @react-native-async-storage/async-storage. Then uninstalled app from simulator. installed it again.
Then again did expo start still see.
Error: [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.
Do i have to again create eas build development build?
1 / uninstall the app from your phone or simulator
2/ created a new build
3/ install the app
1 / uninstall the app from your phone or simulator 2/ created a new build 3/ install the app
I've tried several times but it still doesn't work! Any suggestions?