React-Native with macos target - ios

Trying to create a NEW project which targets -both- macos and ios/android seems to fail.
Steps:
Followed steps on react native website, using create-react-native-app to get a native application. It works fine.
Use react-native-macos init and macos to get the mac app - it also works fine.
Noticing that #1 uses an App.js and #2 uses some sort of index.platform.js model, I change the xcode project in #2 to look for App.js instead. This at least makes sure the same code is reached.
As the react-native-macos github page says to do, I merge #2 into #1.. (unclear whether should overwriting, used 'ditto' command)
Add the rn-cli.config.js file to root, as react-native-macos says to do
Missing modules when I try to run macos - fails to bundle.
It looks to me like the 'react-native' folder in the node modules is somehow screwing up the react-native-macos folder. I'm still trying a variety of things but it's been exhausting considering how easy 'merge into your existing project' sounds.
https://github.com/ptmt/react-native-macos <- what i want to merge in

You likely will not be able to use create-react-native-app and react-native-macos together without some trail and error. This is because create-react-native-app actually creates an Expo app which is built on top of react-native but tries to abstract away a lot of the native details from the end user. For example you can't use any native modules that are not shipped with Expo when using create-react-native-app. The documentation of react-native-macos is likely assuming you are using react-native init which creates a base react-native project that you have to handle building on your own instead of offloading the build process to Expo.

Related

React Native + ARKit = "React/RCTConvert.h not found"

I am trying to use React Native with ARKit for the first time and I ran into a problem.
What I did:
(in Terminal)
react-native init myApp
cd myApp
npm install --save react-native-arkit
react-native link react-native-arkit
(in XCode)
Open myApp workspace under myApp/ios
Assign my Team
Trying to Build on a device
What I got:
React/RCTConvert.h' file not found
in color-grabber.m
I found a lot of references to the same problem online (dating back to 2017+), none of the fixes they offered seemed to work for me.
Truly appreciate any help!
Just want to provide an update if anyone is interested.
After a long array of manual updates to the settings I managed to fix most of the issues. However, given that the package is not supported, I gave up on it.
The way to go seems Viro React which is now open source and is pretty actively supported. Unfortunately, it is not suitable for my purposes (I need a very small footprint), so I will try using iOS native components instead.

How to resolve conflicts in `project.pbxproj` file while upgrading react native?

I am using Xcode 9.4 and current react native version #0.54.4 I want to upgrade the version to 0.55.4.
As I upgrade my project using react-native-git-upgrade, I see some un merged conflicts in the project.pbxproj. Some of the settings are my own that are conflicting with the changes in the new version.
I tried all the possible ways in which I could resolve the conflicts. But still X-code shows the error could not load the project, and it does not allow me to build my project.
How do I understand what those conflicts are referring to and how can I safely resolve the conflicts?
Unfortunately there is no magic way to resolve conflicts. I wish there was. The file is managed by Xcode and from personal experience I have found that you can easily mess it up performing merges.
Git is definitely your best-friend. Make sure that before you start any merge you are on a new branch and fully committed so that if you mess-up you can easily get back to your original version.
What I usually do is keep the original version of the project.pbxproj and then make the changes manually in Xcode. I know this doesn't sound ideal but it does mean you should be able to open the project in Xcode, though your project may not run - just yet.
If you’re unclear about which version to keep, I would keep ours as that is the original version of your project.pbxproj. From the documentation:
You can think of "ours" as "your team" and "theirs" as "the React Native dev team".
Then I would make the changes manually as detailed below. As that will show their changes and the should hopefully not be that many.
To help me find the changes that I have to make I find that React Native Upgrade Helper is an invaluable resource. There you can find a git diff of any two versions of react-native that you choose. (This saves you having to create two projects and then compare them yourself, a big timesaver.)
Currently you are upgrading from 0.54.4 to 0.55.4 this link shows the diff between those versions
https://react-native-community.github.io/upgrade-helper/?from=0.54.4&to=0.55.4
For additional help you could create a project in a specific react-native version, using the following will create a project for version 0.55.4.
react-native init newproject --version react-native#0.55.4
That way you can look inside the Xcode project to see what has been added, and where it was added from, as the git diff doesn't always tell where it came from.
I have never had much luck using react-native-git-upgrade and I have come to prefer doing it manually, as I have had much more success doing it that way.
After updating react native to version 0.55 from 0.51, everything seemed to function normally in the local mode. But the production build fails.
I fixed this by upgrading react native once again from 0.51, and keeping my changes instead of theirs almost all the time.
May be there should be more detailed explanation in the documentation regarding the kind of issues one run into, by picking the wrong changes.

Changes disappearing when building Cordova app for ios

I'm an absolute beginner with Cordova and was following this tutorial when I started experiencing my problem.
The tutorial is more aimed at building the project for android but I applied the same steps to create an ios build on my mac.
danieloram CordovaProject $ cordova run ios
the default project builds and runs fine but whenever I edit either the index.html or cordova.js files in the ios directory of the platforms folder and run the above command (or cordova build ios), all my changes revert back to the default code.. This behaviour isn't mentioned anywhere that I can see in the linked tutorial.
Am I missing something really obvious?
I haven't been able to find anything online about any other users experiencing this issue.. so I'm inclined to think it is trivial.
Seems I found my answer, and a quick one at that.
The tutorial did not explicitly state which index.html file I was to edit so I naturally assumed it was the file nested inside the platforms/ios directory.
These file however should not be edited as they are overwritten using the outermost index.html file in the myapp/www/ folder.
This SO answer sums it up perfectly with more detail.

How can you permanently change iOS app configuration in Meteor Cordova?

Every time I meteor build, I have to open XCode and do the following:
remove and add an item from "Link Binary With Libraries" (Facebook SDK)
add a URL Type (custom URL scheme for my app)
add a "Required device capabilities" to "Custom iOS Target Properties"
How can I edit my Meteor project to have these steps done automatically, and to auto add things to AndroidManifest.xml?
In some way use mobile-config.js or cordova-build-override?
I'm happy to see another guy who is trying to build a hybrid application using Meteor / extending a Meteor Cordova iOS app, since I'm facing the very same issues. So I'm very happy to share my experiences and approaches with you. :-)
So far, I ended up with the following approach:
I created a base template for my iOS app using meteor build (not meteor run ios-device, since I did not know if Meteor does some optimizations for production code).
Then, I copied the whole Xcode project under /platforms/ios to another loaction and used this new project as my "master" project from then on. This project is being enriched with native code, e.g. it also includes the Cocoa Pods I'm needing.
Of course, I also did not want to copy files each and every time I trigger a new Meteor build. At least, I would like to have the Staging/www folder updated, as this is happening quite frequently.
So my first (rather naive) approach was
delete the Staging/www folder in the master project
replace it with a relative link (using Xcode's linking functionality) to the Staging/www folder inside the .meteor/local/.../ios/ project
This approach did not work, since the shell script used in the Meteor Xcode project can't handle these links.
My second approach is to create a symlink on the filesystem level instead. This works as it should, and I'm able to build the project in Xcode as it should.
I could have followed the same approach for the Cordova plugins folder, but I've decided to replace the plugins manually in order to get a better control over them, even it means a bit more effort then.
Having the symlink in place also means that Xcode's version management (and also SVN which I am using for everything) will ignore everything below Staging/www, which is good in my opinion, because I'm already versioning the webapp code in the Meteor project itself.
BTW: I've started a discussion thread on hybrid mobile app on the Meteor forums as well, but so far it did not get too much attraction:
https://forums.meteor.com/t/building-a-hybrid-meteor-cordova-app-share-experiences/8212
Maybe we could follow up on Meteor-specific things there, to have the Meteor community participate in the discussion?
EDIT: I would also like to share an approach that failed completely, at least for me, maybe I was too dumb... Before I used Meteor's Xcode template as the starting point, I also tried it "the other way round", i.e. I started with my already existing Xcode app project and tried to include Meteor's / Cordova's part by hand. Using this approach, I never managed to set everything up correctly. I had lots of troubles and also had to tweak a lot of the compiler / linker flags to even get the code compiling. This grew me a lot of gray hairs. But even after I managed to get everything to compile, Meteor hang during startup - and I never figured out why.
One remaining problem I'm still facing is that Meteor's hot code push functionality seems to have some severe issues on iOS, that are also documented as GitHub issues. It can happen that the iOS app gets completely broken and needs to be reinstalled. I tried the mdg:reload-on-resume package, but this did not work as it should and made things even worse. As far as I can tell from the GitHub discussions, one should better disable hot code push until the Meteor team has addressed these issues. Breaking the app completely due to code pushes is not what my users would expect.
Unfortunately plist values (and assumably AndroidManifest.xml as well) can only be changed by a plugin:
Add entry to iOS .plist file via Cordova config.xml

MvvmCross sample projects run

I'm trying to introduce myself into the MVVMCross project, but I can not run the sample MonoDroid projects in the emulator. The WinPhone7 project run perfectly.
I get the following error during the Copying application to device process
http://snag.gy/PCY39.jpg
I tried the MonoCross sample projects, it runs correctly. What am I doing wrong?
I think that means that one of the Android SDK add-on libraries you are trying to use is not available on the device/emulator. An example would be if the Google maps .jar isn't on the device and you are trying to use it.
I've just pushed some changes to GitHub which separate the Maps dependencies out into a separate assembly.
You will still need Maps installed (follow instructions like http://3zwireless.com/Android1.html) for the Conference sample, but Tutorial, BestSellers, TwitterSearch, SimpleDroid, and CustomerManagement should install and run on a non-mapping Emulator.

Resources