developers
I'm working on a React Native project created with Expo
i use * AsyncStorage *to make a user authentication
i faced this problem when i use my phone to test my app
this is a capture of the error in my phone, but there is not erreur in * Expo DevTools console *
I'm not quite sure about the Expo but since React native 0.60, Facebook removed some of these packages from the react native core to reduce the size because those libs are not necessary for all the users. So in order to use AsyncStorage, now you have to manually install it using NPM or Yarn first. So from your screenshot I assume that is true for Expo as well.
However do the following and you will be fine. I assume you have react native version higher than 0.60
if your package manager is Yarn, then : yarn add #react-native-community/async-storage
or
if your package manager is NPM, then : npm i --save #react-native-community/async-storage
After that, use below code part to update iOS Pods. Run this from your project root using terminal.
cd ios / && pod install && cd ...
Now try to run the app. App will start to work if there are no any other issues.
For more information about AsynStorage, please use this link.
Related
I'm trying to import a compass module without success using expo and react native
LINK to library
The error appears when I uncomment the import line, which gives me the error:
import RNSimpleCompass from 'react-native-simple-compass';
null is not an Object (Evaluating 'RNSimpleCompass.start')
I basically install the library using the provided instructions:
npm install react-native-simple-compass --save
I also tried linking it
npx react-native link react-native-simple-compass
then I run
npm start
which starts expo and gives me the error
I usually install and run other npm packages without problem, but this one keeps complaining when importing it.
I checked that the library is in my package.json dependencies. I even tried deleting the node_modules folder and re running npm install to reinstall all dependencies, but the error persist.
Am I missing something?
When you have expo "managed" project (without "ios" and "android" directories) you can't use react-native libraries that contain native code(objc or java). It worked in other cases because you probably were adding js only libraries or libraries that are explicitly supported by expo.
If you want to use that library you would need to eject to bare workflow(expo eject). You will still have access to all expo libraries you are currently using, but you won't be able to build it on Expo servers.
I'm following the steps in React Navigation to install it on an expo project, however it isn't working.
I am executing expo install react-navigation react-native-gesture-handler react-native-reanimated react-native-screens in Windows CMD but it isn't installing anything besides react-navigation:
if you have the latest expo version then you can expo init demoApp command
then you will asked to select template, select tabs template which will take care of all the dependencies for react-navigation, and give you a start-up app to work on
What are the steps to run a react native project in android studio after eject from create react native. I didn't find a helpful step by step description online for this. I am pretty new to android development, facing different problems related to gradle versions and other stuffs in android. Do I need to run it from android studio, or just need to run the command npm run android
Install React Native using Mac OS
Please check React Native Document before start.
https://facebook.github.io/react-native/docs/getting-started.html
If you don’t have install brew in your computer then must hit that command line.
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
Then Follow the Command step to step
brew install node
Once Complete node step up then you must Create React Native Directory in your Computer to do this follow the Following Steps:
Open Terminal and hit…
cd
cd Documents
mkdir react-native
cd react-native/
Now You create your React Native Directory now once it’s done.
Node comes with npm, which lets you install the React Native command line interface.
Run the following command in a Terminal:
npm i react-native-cli - g
it need some time to complete install once it’s done make sure you check it’s npm version to do that hit the following command line.
npm -v
So you get your version code if you are using 4.6.1 above then maybe you are using some of the problems so remove above version and use this of a version using this command line.
npm I -g npm#4.6.1
Hit enter and you start with that npm version. So it’s Done now Follow the React Native Document if you are using Android and iOS then you can follow the Steps but skip installation node step because we set up all those steps and once you are using Setup Android or Xcode in your pc Follow the Command to run React Native app.
Using your React Native Folder that you create in a directory like this
cd
cd Documents
mkdir react-native
cd react-native/
react-native init HelloWorld
Here we are Create our HelloWorld Programme Using Android Studio and React Native.
Once you have ejected you need to run below commands
exp run
react-native run-android
Make sure exp is installed. exp run will serve the js bundle locally which will be accessed when your android app runs via react-native run-android command on simulator or connected device.
I'm a beginner in using JavaScript and the framework React Native.
I have the task to program a mobile web app with React Native with another student from my class. He started to build an app, which is build without any problems on his Android Emulator. He sent me his App and node.js (my editor is JetBrains WebStorm, my partner uses the same editor) does not recognize my import react.
But when I start the app in my command line with react-native run-android everything function and I can see the app, but my problem is
that I can't run it from my editor.
I have already install those in my command line:
C:\Users\Hang>npm install -g yarn
C:\Users\Hang>npm install -g react-native-cli
What did I forget to install ?
Here is a screenshot of the message that I get when I try to run the App:
You are using Node.js Run configuration to start your application, but Node.js doesn't support ES6 modules natively (thus the Syntax erroron import), and, of course, it doesn't support react-native cli options, so running node index.android.js as you do won't start your app in android emulator. You should have used React Native run configuration instead. Please see https://blog.jetbrains.com/webstorm/2016/12/developing-mobile-apps-with-react-native-in-webstorm/, Running and debugging the app section
You have to install the react Native CLI for your IDE (webstorm)
you will find It here
I am using react-native-device-info library, and it works fine for iOS simulator. But for Android I receive an error:
undefined is not object (evaluating 'RNDeviceInfo.deviceId')
What can be the problem?
I installed it like is described in the guide on the library's page (using rnpm).
Then in componentWillMount() I am trying to get the device id:
import DeviceInfo from 'react-native-device-info';
...
componentWillMount() {
let clientId = DeviceInfo.getUniqueID();
}
In addition to rnpm install react-native-device-info and instruction from here, I had to manually add some lines to the following files:
<YourReactProject>/android/settings.gradle:
rootProject.name = 'YourReactProject'
include ':app', ':react-native-device-info'
project(':react-native-device-info').projectDir = newFile(rootProject.projectDir, '../node_modules/react-native-device-info/android')
<YourReactProject>/android/app/build.gradle:
...
dependencies {
compile fileTree(dir: "libs", include: ["*.jar"])
compile "com.android.support:appcompat-v7:23.0.1"
compile "com.facebook.react:react-native:+" // From node_modules
compile project(':react-native-device-info')
}
...
Rebuild by running react-native run-android
First check is it added to your package.json or not?
Then link the package with react native using following command
react-native link react-native-device-info
It manually links the package with react-native.
I am facing this issue in IOS.
Even I link the package it showing the same issue.
open your project in Xcode,
then under build phases add a binary file of react-native-device-info by clicking on the + button.
Rerun the project, It worked for me.
Firstly, make sure that react-native-device-info is linked in your project if you are using react-native version < 0.60.
If not linked, link it using react-native link react-native-device-info and then run react-native run-android command.
If using react-native version >= 0.60 skip this link command as auto-linking should work but make sure to run react-native run-android command.
and then use it using,
import DeviceInfo from 'react-native-device-info';
DeviceInfo.getUniqueId()
There is a small typo. You are using DeviceInfo.getUniqueID(); instead of DeviceInfo.getUniqueId()
Review in the documentation here
It looks like this package now uses Cocoapods. Run react-native link then check your Podfile for something like this:
pod 'RNDeviceInfo', :path => '../node_modules/react-native-device-info'
If that's in there, then you just need to install / update your pods.
cd ios
pod install
or
cd ios
pod update
Make sure you restart the metro server and re-run react-native run-ios
use the manual installation and change
your project\node_modules\react-native-device-info\android\build.gradle'
dependencies {
def googlePlayServicesVersion = project.hasProperty('googlePlayServicesVersion') ? project.googlePlayServicesVersion : DEFAULT_GOOGLE_PLAY_SERVICES_VERSION
compile 'com.facebook.react:react-native:+'
compile "com.google.android.gms:play-services-gcm:$googlePlayServicesVersion"}
in here implementation as a compile