async-storage is not working after importing as '@react-native-comiunity/async-storage

[MalinPramoditha]

if I import async storage from react-native it only works in ios but can't import as react-native-community/async-storage.error is

Failed to load bundle(http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false) with error:(Unable to resolve module react-native-community/async-storage from /Users/conconsolutions1/Documents/projects/venture-trading-app/src/Screens/Login/LogInScreen.js: Module react-native-community/async-storage does not exist in the Haste module map

[krizzu]

Hi @MalinPramoditha ,

Did you follow getting started instructions ? Have you restarted Metro after installing new modules?

[MalinPramoditha]

Hi @krizzu

yes I restarted the metro bundler.y code is simple

class LogInScreen extends Component { constructor(props){ super(props); this.state= { username: '', password: '', } } userInfo = {username: 'admin',password: 'admin'} _login = async() => { if(this.userInfo.username === this.state.username && this.userInfo.password === this.state.password){ await AsyncStorage.setItem('isLoggedIn', '1'); this.props.navigation.navigate('DashboardTab') } else { alert('wrong password') } } _logout = async() => { await AsyncStorage.clear(); this.props.navigation.navigate('Auth'); } render() { return ( <SafeAreaView style={{flex: 1, }}> <View style={{flex:1,justifyContent: 'center',}}> <MainInput onChangeText={(username)=>this.setState({username})} placeholder="Mobile Number"></MainInput> <MainInput onChangeText={(password)=> this.setState({password})} secureTextEntry={true} placeholder="Password"></MainInput> </View> <MainButtonColor onPress={this._login} style={{bottom: 0,position: 'absolute'}}>LOGIN</MainButtonColor> <Button title="logOut" onPress={this._logout}/> </SafeAreaView> ) } } export default LogInScreen;

[MalinPramoditha]

class LogInScreen extends Component {
constructor(props){
super(props);
this.state= {
username: '',
password: '',
}
}
userInfo = {username: 'admin',password: 'admin'}
_login = async() => {
if(this.userInfo.username === this.state.username && this.userInfo.password === this.state.password){
await AsyncStorage.setItem('isLoggedIn', '1');
this.props.navigation.navigate('DashboardTab')
} else {
alert('wrong password')
}
}
_logout = async() => {
await AsyncStorage.clear();
this.props.navigation.navigate('Auth');
}
render() {
return (
<SafeAreaView style={{flex: 1, }}>
<View style={{flex:1,justifyContent: 'center',}}>
<MainInput onChangeText={(username)=>this.setState({username})} placeholder="Mobile Number">
<MainInput onChangeText={(password)=> this.setState({password})} secureTextEntry={true} placeholder="Password">

<MainButtonColor onPress={this._login} style={{bottom: 0,position: 'absolute'}}>LOGIN


)
}
}
export default LogInScreen;

[krizzu]

Can you check if you have node_modules/@react-native-community/async-storage dir available?

[MalinPramoditha]

Hi @krizzu

yes node_modules/@react-native-community/async-storage dir is available

[krizzu]

What version of Async Storage are you using?

Try starting packager with your transform caches cleared, with react-native start --clearCache

[tido64]

@MalinPramoditha How did you import it? What does the import/require statement look like? Did you include the @ symbol as well?

[stacywang0601]

I'm using this package when I upgrade the storage of redux-persist

See issue here https://github.com/rt2zz/redux-persist/

When I use

import AsyncStorage from '@react-native-community/async-storage';
const persistConfig = {
  key: 'root',
  storage: AsyncStorage,
  ...
};

I got error saying [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

My app is a react native app. Do I have to have access to native layer to use this package?

[alienfractal]

Same here :(

[krizzu]

@stacywang0601 @dante8300 Yes, you have to link the library, before you can use it. Please refer to docs or main README to learn how to do it. Remember to re-build your application after you link it.

And make sure you're not using Expo, as this won't work with it.

[HenryQuan]

I am also having the same issue. I have reinstalled packages multiple times and linked them all. I can also see it inside my node_modules folder. I have reset cache with react-native start --reset-cache and removed build folder.

package.json
"react-native": "^0.59.10",
"@react-native-community/async-storage": "^1.5.0",

However, I have another project W using exactly the same version (1.5.0) and it works (I copy and paste the import statement from W to my project). The only difference is that W is using react native 0.59.9. It might be related to how I setup my packages because I haven't touched that project (not working one) for a while.

[krizzu]

What platform are you having problems with? If it's Android, please manually check your main application for AsyncStorage instance (you can refer to my comment here).

Are you using React Native Navigation by any chance?

[HenryQuan]

@krizzu You are absolutely right. There is no new AsyncStoragePackage() there in my MainApplication.java (it worked before with only react-native link). I am using react native router flux which I believe is a wrapper around react navigation (not the wix one). Thanks for your help.

[krizzu]

Closing this down. If you need more help, reopen it.

[diljithvandanam]

issue with netinfo and async storage :

"@react-native-community/async-storage": "^1.6.1",
"@react-native-community/netinfo": "^4.1.4",
"react-native": "0.59.9",

i had added new AsyncStoragePackage() and new NetInfoPackage() to mainApplication.java, when i run android the build is getting succeeded but app crashes on launch, please help

[krizzu]

@diljithvandanam

Please check your adb logcat output and see where the crash is coming from.