No Android or IOS specific files on React Native Project Folder - javascript

I followed React Native Official Doc Step By Step from
https://facebook.github.io/react-native/docs/getting-started.html
and initialized a project and got the following files (except splash.js and style.js)
For learning React Native I was following a youtube video and in there the project folder contained some android and ios specific files.
But I ran the project by creating a simple splash screen and it's running on both android or ios file.
As a beginner I'm so confused. So How can i get those files.
For Example,
index.ios.js
Index.android.js

just double check that you follow this instructions https://facebook.github.io/react-native/docs/getting-started.html and not something else.
Now what i am doing is
1) npm install -g react-native-cli
2) react-native init AwesomeProject
3) cd AwesomeProject
4) react-native run-ios

you are using expo if you want native code try Building Projects with Native Code tab on https://facebook.github.io/react-native/docs/getting-started.html#getting-started

Related

Is there any way to reduce expo apk size without using pure react-native?

I am trying to install pure react-native but every now and then I am getting some error. So it would be nice if there is a way to reduce expo apk size.
You can migrate to react-native
make a new react app "react-native init"
Copy the source files over from Expo project
Install all dependencies of the Expo project except Expo specific
libraries.
Make necessary adjustments to app.json file
Download the signing key of your Android app from Expo using exp
fetch:android:keystore and set it up
More details here Reduced the Size of React Native App by 86%

RNCSlider was not found in the UI Manager when trying to use #react-native-community/slider

I'm trying to create a slider in my react native Android App, and relatively new to React Native. The React Native documentation says their Slider component is deprecated (https://reactnative.dev/docs/slider.html) and directs us to use #react-native-community/slider instead (https://github.com/react-native-community/react-native-slider/blob/master/README.md).
I installed the library in my project directory using npm install #react-native-community/slider --save.
The install succeeded and my versions in my package.json are as follows:
"dependencies": {
"#react-native-community/slider": "^3.0.3",
"react": "16.13.1",
"react-native": "0.63.0" },
I am including the Slider in my source file with import Slider from '#react-native-community/slider';, however when ever I try to actually create a slider in my code with the <Slider> ... </Slider> tags, I get the following compile error:
ERROR Invariant Violation: requireNativeComponent: "RNCSlider" was not found in the UIManager.
I've been banging my head against the wall and can't figure out how to clear the error.
I am on Windows 10 x64 developing for Android.
Thanks in advance!
I've also faced this issue and if you've followed the setup instructions word by word, the solution should be:
Stop the Metro Bundler.
Stop the app on the simulator/physical device.
Run react-native-start.
Run react-native run-android or run the app on your physical device.
Done!
This is what fixed it for me for development on iOS. Hope this can be of help to you on Android as well!
The solution for me was to just run "npx react-native run-android" in my project directory rather than trying to use "npx react-native start". I'm not sure why this works, but it launches the metro server in another console window (using cli.js) rather than in powershell itself. This seems to solve the problem.
Historically I had been launching the app directly from my emulated phone OS, but this didn't work even if I had the metro server running in powershell.
run command in vs code terminal
cd ios
pod install
cd ..
react-native run-ios
or
react-native android
I tried #Californium's method to stop the Metro Bundler, Simulator, and re-run everything, but that didn't work for me. I also tried to link Slider, but that even didn't work for me.
react-native link #react-native-community/slider
I think You need to just
Import Slider form 'react-native'
This worked for me.
You can try all the steps, provided and if those didn't work. Use the slider from react-native.

Invalid sdkVersion while running react native project

I'm stuck on the initial part of react native app building. I'm using create-react-native-app pkg to create the project and When I run the android version app through "yarn run android" command I get the error below:
Error: Invalid sdkVersion. Valid options are 10.0.0, 11.0.0, 12.0.0, 13.0.0, 14.0.0, 15.0.0, 16.0.0, 17.0.0, 18.0.0, 19.0.0, 20.0.0, 21.0.0, 22.0.0, 23.0.0, 24.0.0, 25.0.0, 7.0.0, 8.0.0, 9.0.0
It's a windows machine. Node v10.0.0, npm v5.6.0, Java 1.8 & android studio is already installed and working I added variety of APIs through android studio.. currently I have 17-23-24-26 installed in Sdk platforms.
And I get the following error on real android device:
uncaught Error: console.error: React Native version mismatch.
Javascript version: 0.53.0
Native version: 0.52.0
Make sure that you have rebuilt the native code. If the problem persists try clearing the Watchman and packager caches with 'watchman watch-del-all && react-native start --reset-cache.
I didn't find solution ...
I solve this issue by installation of Expo XDE window app.
the problem was missing schema-27.0.0.json file in directory:
C:\Users\{user}\AppData\Local\Expo
download Expo XDE
schema.json version is depend on react native npm version that you installed.
documents here
open your build.gradle file ( located in YOUR_PROJECT/android/app/build.gradle ) and validate your compileSdkVersion
EDIT
if you are using expo check sdkVersion in your app.json file and be sure it is same as one in package.json file
In the file app.json put "sdkVersion": "36.0.0",
{
"expo": {
"name": "name-app",
"slug": "name-app",
"sdkVersion": "36.0.0",
...

React native init android,ios and app folder missing

Missing android,ios & app folders and index js files
I'm using react native v 0.1.10 in windows 7 OS
We can generate android and ios folder by using upgrade
Run react-native upgrade to generate /ios and /android folders again.
Run react-native link for any native dependency. (if needed)
Finally run
react-native run-ios
or
react-native run-android
Probably you created your project using create-react-native-app, which is an even more simplified toolchain.
You should probably eject if you need android/ios native configs or something.
Please take a look at this doc: https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md
Try this to generate the Android and iOS folder without change version
react-native eject
react-native link
Install a new file using powershell instead of cmd.
Run following commands
1. npx react-native eject
After running above command you can see output in console as follows
info Generating the iOS folder.
info Generating the Android folder.
Next below command
2. npx react-native run-android
Try update ur nodejs and npm to the latest version then run everything again starting from init
npm run eject
next we will get some couple of questions,
? how would you like to eject from create-react-native-app
React-Native : I'd like a regular react native project
? What should your app appear as on a users's home screen? _Your wish____
? What should your Android Studio and Xcode projects be called? rncourse
After Ejected Successfully the project structure will change, added folders android and ios.
happy coding

Run a React Native app without launching Xcode?

Can an iOS app (built entirely with React Native) be built/run from the command line? PhoneGap has a nice ios-sim utility for doing just that, but I haven't had any luck with it.
If you build the project once using Xcode, then you can close it, run npm start in your project root (to start the packager), fire up the Simulator (maybe using ios-sim). Since you built it once in Xcode, the app will be installed in the simulator so you can just run it and the whole CMD+R refresh process will work.
Fire up the server with:
$ npm start
Build/run the app in the ios simulator:
$ react-native run-ios

Categories