ERROR:offline js file is empty - react-native

hai in my react native project structure is like this:
Project
• Ios
• Project
• Base.Iproj
• Images.xcassets
• AppDelegate.h
• AppDelegate.m
• Info.plist
• Main.jsbundle
• Main.m
• Project.xcodeproj
• ProjectTests
• Index.ios.js
• Package.json
when i need to run i ma getting error like this Error:Offline js file is empty. see ios/main.jsbundle for instructions
but the main.jsbundile file is in ios/Project/main.jsbundle,
can any one help me how to avoid this error

This is not a linking problem. This is a problem with the main.jsbundle in your iOS application project folder not updating. If you open the existing main.jsbundle it just throws an error, which is what you're seeing on your device.
To fix this create a new main.jsbundle.
From your React project's root (/Project), run the following command in a Terminal shell: react-native bundle --minify. If run successfully it will create a new main.jsbundle and drop it in /Project/iOS/.
Replace the existing main.jsbundle in /Project/iOS/Project with the one created in /Project/iOS/
(Having to do this manually is frustrating and should be automated, or fixed within the React Native script)
Clean, build and re-run the app and it should load on the device.
More from FB on how to run your app on a device:
https://facebook.github.io/react-native/docs/running-on-device-ios.html

Related

React native android emulator: could not create task ':realm:compileDebugJavaWithJavac'

I have macbook M1 and trying to run Android emulator. When I run a command to launch the emulator I get the errorsCould not create task ':realm:compileDebugJavaWithJavac'.
Could not create task ':realm:forwardDebugPort'.
> SDK location not found. Define location with an ANDROID_SDK_ROOT environment variable or by setting the sdk.dir path in your project's local properties file at '/Users/.../btp-react-native-field-data-capture/android/local.properties'.
I don't have this file and what do I need to add there?
Thanks
I ran into the same issue, but was able to resolve by creating a new file named "local.properties" in my android folder.
You just need to add the following line.
sdk.dir = /Users/YOUR_MAC_USERNAME/Library/Android/sdk
Reference below.
React Native android build failed. SDK location not found

React Native Multiple command produce same file

I tried to build a react native app for iOS and I hit this error:
Build system information
error: Multiple commands produce '/Volumes/Data/sources/react-native/test/ios/build/test/Build/Products/Debug-iphonesimulator/test.app/Zocial.ttf':
1) Target 'test' (project 'test') has copy command from '/Volumes/Data/sources/react-native/test/node_modules/react-native-vector-icons/Fonts/Zocial.ttf' to '/Volumes/Data/sources/react-native/test/ios/build/test/Build/Products/Debug-iphonesimulator/test.app/Zocial.ttf'
2) That command depends on command in Target 'test' (project 'test'): script phase “[CP] Copy Pods Resources”
You can try deleting the build folder in ios directory and rebuilding your app again. It might solve this issue
It looks like you have installed some library with fonts that iOS don't have linked. Try this:
Create an empty dir in your project to store some future useful fonts (for example "Nunito" family font). I suggest create fonts folder into assets --> assets/fonts
Create a new file named react-native.config.js in the root of your project and add into it the following:
module.exports = {
project: {
ios: {},
android: {}
},
assets: ['./src/assets/fonts/'],
};
In your project dir run react-native link
Go to ios dir (cd ios) and run pod update
Build
Especial thanks to Alex Biddle: https://medium.com/better-programming/how-to-add-custom-fonts-to-your-react-native-project-c64305281b9
I had this error with react-native-vector-icons installed after I executed react-native link. My solution was to remove fonts copying from XCode Build Phases.

React Native Error when `run-android`

I installed all dependencies and libs like the instructions on https://facebook.github.io/react-native/docs/getting-started.html
Everything is fine.
But when i try to run react-native run-android i throws me errors (see screenshot)
HAXM is installed on my machine as well.
What can i do to run it on my machine in the emulator?
SDK:
"SDK location no found" export/add your sdk location path in PATH variable. For linux maching run following command in terminal:
$ export PATH="/Users/<username>/Library/Android/sdk/platform-tools/:$PATH"
$ react-native run-android
Go to your project android folder. And create a file called "local.properties".
Inside this file write this:
"sdk.dir={sdk_location}"
Just replace {skd_location} with the path to your android sdk.
Then run "react-native run-android" again and it should work.
The error simply specifies that you are not providing the sdk path to you project. So for this you need to create a local.properties file inside your android folder of the project. Inside that local.properties file just add the location for your android SDK as below :-
sdk.dir = /Users/piet/Library/Android/sdk //this is your sdk path
I have provided the path from the screenshot given by you but change the path of your android SDK if it is different.

Can I Copy Over React Native Files Initialized Under One Project Over To Another Separately Initialized Project?

Let's say I initialize a project under react-native init <filename>, installed a bunch of node packages, and added code.
Then separately I initialize a different project under react-viro init <filename>, installed a bunch of node packages, and added code.
If I wanted to combine what I created under react-native init into what I created under react-viro init, is it as simple as copying files over and reinstalling missing node packages into the react-viro project?
Assuming you are working in the ./src folder, every file is independent of iOS or Android as part of the JavaScript bundle.
You can simply copy the .js files over and install the node packages in that project.
You probably should not copy any files that are outside the ./src folder, but I also suspect you wouldn't need to. Files in the Android and iOS folders are rarely touched as they contain operating system config settings and custom modules that you would have wrote in the native languages.
If the file renders JSX, you will be safe to just copy it over and hook it back up.
To state it another way, go into the folder that has node_modules in it. You shouldn't copy anything that is in that folder except additional files that you created. This is where people normally create an src folder and place all their JavaScript. You probably have an index file in there that points to ./src/app.js or you may have an index.ios.js and index.android.js that both point to a ./src/app.js. Anything inside src is safe.
That's my best answer without seeing your folders and files.
If you intend to copy code from one react native project to another, make sure the code you intend to copy is JS and not any native files. Make sure you do register the correct component using AppRegistry. Rest assured you can copy the code from one project to another.
Assuming you have a project at folder
/my-project/android
/my-project/ios
/my-project/src
Copy my-project and paste it at your desired folder like
/new-my-project
Change git origin
git remote set-url origin https://gitlab.com/..../**.git
Open /new-my-project/android in Android Studio, and then rename app/java/com.myproject to com.newmyproject
Go to app/build.grade and change com.myproject to com.newmyproject and sync
Create firebase project and download google-services.json file and add to new-my-project/android/app
Build application, then test application under metro bundler
npx react-native start
Create keystore, test notifications, change base_url_api, test apk etc Android finish now, iOS
Update pods on new-my-project/ios
pod install && pod update
open myproject.xcworkspace
Change bundle identifier to org.reactjs.native.newmyproject, version to 1.0, build to 1 and desired Display name. Let it index completely
Setup in firbase and replace GoogleService-Info.Plist file and Clean build folder in xcode
Go to developer.apple.com and create identifiers, APNS certificates, profiles
Download certificates from keychain and upload to firebase
Build the project in simulator/device and test it.
Done

react-native-maps iOS error

Trying to add airbnb/react-native-maps to my react native project and follow the guide at https://github.com/airbnb/react-native-maps/blob/master/docs/installation.md. Option 1,
Option 1: Cocoapods - Same as the included AirMapsExplorer example
Setup your Podfile like the included example/ios/Podfile then run pod install. (If you do not need GoogleMaps support for iOS, then you can probably completely skip this step.)
Open your project in xCode workspace
Drag the following folder into your project:
node_modules/react-native-maps/ios/AirMaps/
If you need GoogleMaps support also drag this folder into your project:
node_modules/react-native-maps/ios/AirGoogleMaps/
After done, I cannot run the project in Xcode, it gives the error, 'RCTImageLoader.h' file not found.
I hv tried run rnpm link and it cannot go through,
rnpm-link info Android module react-native-maps is already linked
rnpm-link info Linking react-native-maps ios dependency
rnpm-link ERR! It seems something went wrong while linking. Error: ENOENT: no such file or directory, open '/Users/nedved/Desktop/NativeCreditcard_office/node_modules/react-native-maps/ios/AirGoogleMaps.xcodeproj/project.pbxproj'
Please file an issue here: https://github.com/rnpm/rnpm/issues
I can find the file /Users/XXXX/node_modules/react-native-maps/ios/AirGoogleMaps.xcodeproj locally, but when clicking, "Project /Users/XXXX/node_modules/react-native-maps/ios/AirGoogleMaps.xcodeproj cannot be opened because it is missing its project.pbxproj file."
Any idea?