Init IOS project with pods using react-native init command - react-native

Is there any way to create the IOS project with pods using react-native init command?
Currently there is different installation instruction for react native libraries.
Example: Some of them install using react-native link command while other requires to setup using cocoapods. Missing both will leads to lots of compilation errors.
Could anyone suggest what is best way to create project using react-native.
Thanks

On the official react native documentation, there are 2 ways to start up your project, which is using 'CRNA' or 'Build With Native Code'.
For CRNA, it is the fastest and easiest way to start up your project.
It really easy to run your React Native app on a physical device without setting up a development environment. If you want to run your app on the iOS Simulator or an Android Virtual Device, please refer to the instructions for building projects with native code to learn how to install Xcode and set up your Android development environment.
The react native link is used if you want to link your library through the terminal. But in some cases, there are several problem occurred related to library compatibility. I rather suggest use pods or manually link your library through XCode.
Pods is a dependency manager for native code that we use on our native code project. It will automatically generate and link the library.
If you want to have pods on your ios project. After you install cocoapods, you could follow these steps :
1. Open terminal and direct to your project (cd YOUR_PROJECT/ios
2. pod init
3. And then Podfile will be generated within the ios project.
And from now on, you should use YOUR_PROJECT.xcworkspace if you want to manage the project. Thats because Pods should be placed and included same with your project but '.xcodeproj' does not include your Pods.

Related

React Native Error - TypeError: null is not an object (evaluating '_reactNative.NativeModules.RNShare.FACEBOOK')

I'm working on react native project and I am using expo. I want to add the react-native-share package to my project, however I keep getting this error before I even add any code.
TypeError: null is not an object (evaluating '_reactNative.NativeModules.RNShare.FACEBOOK')
Now I know that expo has it's own version of the share, however you can't specify where a person can share it too, which honestly makes the feature useless. It seems to be clear that the reason I can't use this package is because I am using expo and can't install pod into the project -- due to expo reject it --. So what should I do? Any suggestions on how to work around this?
You can't normally use dependencies with native code using Expo. At least when using the classic build system (you're using it when you run expo start in the terminal to run your project). react-native-share has native code (you can check that by going to the repo and seeing if the library has ios and android folders) and therefore can't be used with "standard" Expo.
If you want to use custom native code in your project, you either need to eject from Expo to the bare workflow or - a newer option - use Expo EAS and custom dev clients. Expo EAS allows you to stay in the managed workflow and still use native modules. You might need to write something called a config plugin for some of those native dependencies you want to use, but looking at the documentation, react-native-share should be working just fine without a config plugin.
So: Either eject to the Expo bare workflow, or use Expo EAS and custom dev clients to use native dependencies with the Expo managed workflow. Do note however that you need at least Expo SDK 41 to use EAS and custom development clients.
To learn more about migrating from the classic build system to EAS, see Expo's guide / documentation.

Should I generate a native build when i add native libraries in react native 0.61+?

I have been using RN 0.61.+ for my android and ios app with Codepush for remote JS updates.
With react native auto-linking enabled in 0.60+. When we add a native library, there is no native code added in the android and ios folders except that we need to do a pod install for iOS.
Does this mean I can simply do update to users with JS Bundle on codepush? Or do I have to still create native builds and release on stores?
Yes you have to create new builds.
Here is why
When you add a new native library that supports auto linking you may not see any change in the Android folder but the magic happens in build time where the cli would go through the dependencies and link everything for you. In the case of ios as you said you install them using pod install.
I can simply do update to users with JS Bundle on codepush
You can do this but there is a high chance your app would crash during run time. Let say you update a library to a newer version and you update your JS Bundle, when your JS code access a newly added method in native code there will be a problem. If both signatures match it might work but its an unwanted risk.
So if you are adding a native library always go for a new build.

how to add ios support for existing React Native application with only Android support?

I know it might be very basic question. But I am very new and got a codebase with only android support. I need to add iOS for it. Please help me
As you're aiming to build a cross-platform app, React Native provides two ways to organize the code and seperate it by platform: platform module or platform-specific file extensions.
As you already have an Android app, I assume it has more complexity so you might want to split the code out into separate files.
You say you have an Android app but i don't thing that at any point you specified that the app should only build for Android (you can review in the package and the project configuration). So, the following command should be enough:
react-native run-ios
If you created your react native app from a template (e.g. using npx react-native init ProjectName), it already provides an ios and android folder, so it already supports it. If the file is not there, you could follow the instructions that #Rajan shared above to recreate the ios folder.
If your problem is running the iOS application using npm run ios, and its failing to build or the javascript throws an error, the quickest thing to try is cd ios, then pod install. If this does not work, it might be because you have additional dependencies you have installed, which require specific instructions and configuration to be done in the ios folder. This is library dependent, if needed, will be explained in depth in the README.md of the library. For example, react-native-firebase has a lot of steps, and is different to the android configuration.
Sometimes it is helpful to modify these configurations in XCode instead of editing the files manually (e.g. plist, xml, xproj). You can open xcode quickly using xed ios when in the root project folder.
Note: As usual, remember to have the libraries available in the node_modules folder, npm install.
In the future, you might choose to run different javascript code based on the platform (platform-specific code). React native allows that by using file.android.js and file.ios.js. However, your IDE is likely to struggle with the 2 files, and won't be as helpful compared to file.js. Alternatively, you can import Platform and conditionally check at runtime, what your platform is.
If you used Expo, you don't have access to the native code, but will already support iOS.

Why is that we cannot install native libraries on Expo? (that requires linking)

I am a newbie and learned react-native expo. I am curious why we can't use any native library with Expo.
For example, if I want to use filesystem on expo I just cant use it, I know expo has it's own file system but I want to use another library but that library requires linking so it is not working in expo. Why is that?
I have tried everything.
This is the library that I want to use ==> https://github.com/itinance/react-native-fs
It requires command : react-native link react-native-fs
How do I do it?
You first have to understand the difference between react-native cli & expo
Please read this documentation to understand the difference
React Native expo uses their own servers to compile your javascript into java and return APK file as a complete APP, and that is the reason you do not need android SDKs or android studio environment on your PC when you are using expo
but when you are using react-native cli you do need the android studio environment such as SDKs, because when you are using cli , it compiles the code using that android studio sdk/environment that you made in your PC that is why you do not need a third party server like expo do.
and thats the reason you get android files right in your react-native project and due to which you can add native modules to it.
However you also have the option to use expo-eject, You can read more about expo-eject in this documentation
Thank You!, Have a great day & welcome to stackoverflow community!.

Converting project to react native init

Firstly I created my project with create-react-native-app and I'm developing my app with npm start and I have expo installed on my emulator. How can I convert these project into react native init, I don't want to use expo anymore...I don't neeed any api-es from them...
Thank you
The best resource for this is in the create-react-native-app repository. Try having a look here to get started.
The short answer is to use npm run eject
If you have experience generating signed APKs for Android and code signing with iOS then you shouldn't run into too much trouble.
If you don't, then take the time to go through the Android docs and also this guide should help you get up on running on iOS as well.
Good luck!
Instead of creating your project using the command create-react-native-app, you may create a react native project by following "Building Projects with Native Code" of the getting start guide: https://facebook.github.io/react-native/docs/getting-started.html.
Here you will find out how to:
1. Set up the environment.
2. Installation of phone emulator.
3. Connection of your phone via USB for testing.
4. Create a project using the react-native init command.