React-Navigation and installation error and first-usage - react-native

I am new to react-native or you can say new to React and I am working on react-native navigation I have installed all the required libraries as instructed in https://reactnavigation.org/docs/getting-started but when I am running my code it is giving an error as '#react-navigation/native could not be found within the project or in this directories.' What should I do is there any way to get started with my code? Help me

If you have installed your app following the react native cli guide you might want to try running
gradle clean
in your android folder und then try to run your app in the emulator again.
On my first steps with react native I stumpled upon the same issue. :-)

Related

Failed to intall the app in react native, how can I fix this?

I was trying execute myapp to android but an error occurred.
To clarify what happened, first time I install nodejs and Android Studio.
Later I used the following commands:
npx react-native init 'app'
cd app
npx react-native run-android
Its my fisrt time messing with react native, I was following this page:
https://learn.microsoft.com/pt-br/windows/dev-environment/javascript/react-native-for-android
And the error is:
The error
I want coding in real time for android app.
How can I fix this?
Looks like the terminal output gives you several steps to do/check.
Make sure you have properly set up your android environment. Use this link to do so. You can use Expo-Cli or React-Native-Cli.
SDK location not found. This could be an off-shoot error of not properly doing step 1. However, to cover all of your bases, ensure you have properly set up your Android Emulator. This doc is a great walkthrough.
Once your Android studio and AVD Manager is properly set up, and your development environment is properly set, you should have no issues!
Please let me know if doing the above to steps did or did not solve your errors.
If you follow the steps, https://reactnative.dev/docs/environment-setup and https://developer.android.com/studio/run/emulator there will be no problem.
As a React Native fan on Windows 10, I'd like to mention just few points you need to check.
First, please check following user variables in Environment Variables ( You can see it from System Properties).
adb="C:\Users{username}\AppData\Local\Android\Sdk\platform-tools"
ANDROID_HOME="C:\Users{username}\AppData\Local\Android\Sdk"
JAVA_HOME="C:\Program Files\OpenJDK\openjdk-11.0.15_10"
Path: check if contains {ANDROID_HOME}\platform-tools
Eg:"C:\Users{username}\AppData\Local\Android\Sdk\platform-tools"
Second, if you are using Android Sdk emulator, please make sure that it configured correctly in emulator list in Android Studio.
For an instance, I created a android emulator using android sdk-29 and you can check the followings.
Third, I recommend you, deploy first app on emulator in Android Studio.
Because we need to download gradle zip file and others, it's essential to run your first android app in Android Studio.
When you confirmed your first android app(Deploy empty project app is also okay), you can run your React Native App by Expo-cli or react-native-cli.

Expo Bare Workflow - How To Use And Setup react-native-pdf and react-native-blob-util - React Native

What is the proper way to use native module in react native expo bare workflow ?
I want to use react-native-pdf and react-native-blob-util
But I got error :
TypeError: null is not an object (evaluating 'ReactNativeBlobUtil.DocumentDir')
And
Invariant Violation: "main" has not been registered. This can happen if:
Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
I have following this link : https://openbase.com/js/react-native-pdf
I read in the expo documentation we can use native module using expo bare workflow. And now my project is bare workflow. In the middle of building my apps using expo bare workflow I got and error when using react-native-pdf and react-native-blob-util
I want when user click the button the apps will open the pdf file which have source link pdf from my server.
Is it possible to setup using this native module in expo bare workflow since bare workflow in the documentation said it like this :
https://docs.expo.dev/introduction/managed-vs-bare/
Bare Workflow
In the bare workflow the developer has complete control, along with
the complexity that comes with that. You can use all packages from the
Expo SDK, development builds, and all Expo and EAS Services.
Configuration with app.json / app.config.js is mostly not supported in
this context; instead, you will need to configure each native project
directly.
Please give me a solution of this problem ? If it is not possible please point me to use another best pdf viewer.
Finally solved the problem.
Native Module cannot run in Expo Go
So expo publish will not working because it is run in Expo Go.
Instead, we must change to run in native. Use case example : npm run android or expo run:android. It will run into bare workflow with native module in our code.
I had this same issue. The fix for me was to rebuild the development client first.
npx expo start --dev-client -c
Then run android/iOS.
There is no need to build with expo run:android.

React native app to react native web problem (typescript, babel)

Hello so I'm working on an app for android and iOS which is quite developed by now and I'd like to activate react-native-web on it. the problem is that I have a bug when I try to run the script to launch the web development server :
The first error at the top is the one I'm struggling with I've tried updating my babel config :
I tried deleting the babel config at the root of my project and it changed nothing like the babel config has no importance
It is being used though to build the android app i know that, but for the react native web build it seems he has no importance
But is still get the same error again and again
please let me know if you need any more information's on this issue

Android React Native App Builds In Android Studio But Not Using The React Native CLI

I am able to build my app Using Run in Android Studio, but using the React Native CLI which I prefer, the app will not build using the react-native run-android command.
Using the React Native CLI, I get the error message:
Execution failed for task ':app:packageDebug'.
> react_9eow0duexig9bim4oxa9fkqs2$_run_closure4$_closure6$_closure10$_closure18
There are plenty of online posts about referencing the first line of the error of which none of the solutions fix the build, but there are literally no google results when searching for the second line.
Why would Android Studio be able to build the app when the React Native CLI can't?
I'm using RN v 0.61.4
Any help much appreciated.

React Native stuck on Loading dependency graph, done and when go to localhost:8081, I see React Native packager is running

Env:
Mac OS X
nodejs 8.9.1
Xcode installed
using boilerplate generated by https://github.com/react-community/create-react-native-app
Symptom:
React Native stuck on Loading dependency graph, done and when go to localhost:8081, I see React Native packager is running.
Also the command line after I did npm start what I got is Loading dependency graph, done. and just stay there, even after I waited for almost 5min.
Actually I found the answer myself.
There is actually nothing wrong. I forgot to start the React Native in the simulator! lol Silly right?
So basically let say if you want to start the iOS simulator in a MacOS, you can just do react-native run-ios --simulator="iPhone 5s" in your project root. Then boom! your project started!
Note that React Native can't really run in the browser, it has to be running inside a phone simulator either iOS or Android.
See official doc for more https://facebook.github.io/react-native/docs/running-on-simulator-ios.html
Have fun!