In this React Native tutorial, you'll learn how to integrate React Native into an existing app, demonstrating one approach to adoption of the framework.
Great tutorial but I could not get the release version to work on macOS Sierra with Xcode8, probably due to this error from the extra script:
Error: ENOENT: no such file or directory, open āpackage.jsonā
at Error (native)
at Object.fs.openSync (fs.js:640:18)
at Object.fs.readFileSync (fs.js:508:33)
at Object.module.exports.options.default (/Users/mikael/Downloads/Mixer-Completed/js/node_modules/react-native/local-cli/android/android.js:29:10)
at options.forEach.opt (/Users/mikael/Downloads/Mixer-Completed/js/node_modules/react-native/local-cli/cliEntry.js:132:43)
at Array.forEach (native)
at addCommand (/Users/mikael/Downloads/Mixer-Completed/js/node_modules/react-native/local-cli/cliEntry.js:128:6)
at commands.forEach.cmd (/Users/mikael/Downloads/Mixer-Completed/js/node_modules/react-native/local-cli/cliEntry.js:166:27)
at Array.forEach (native)
at Object.run (/Users/mikael/Downloads/Mixer-Completed/js/node_modules/react-native/local-cli/cliEntry.js:166:12)
Any idea of why?
Iām looking into the best solution. As a work around, you can temporarily edit this file:
Mixer-Starter/js/node_modules/react-native/local-cli/commands.js
To comment out the require for /android/adroid
const documentedCommands = [
//require('./android/android'),
Thanks for your reply, it worked!
But it seems a little strange that some android function messes up the ios build.
Perhaps some environment variable is needed?
Strange indeed. The code that is causing the error is actually making an assumption that the package.json file is on the same folder level as the android folder. Iām trying to trace why it may have worked previously (the functionality was there previously, then removed, then re-added). Iām checking to see if passing any environment variables or command-line arguments works better.
Can we get the control of touch events in iOS native when we are loading the Web url into JS file?
//For example the JS looks like below
āuse strictā;
import React, { Component } from āreactā;
import {
AppRegistry,
StyleSheet,
Text,
View,
WebView } from āreact-nativeā;
class ReactNativeSample extends Component {
render() {
return (
<WebView
source={{uri: āGitHub - facebook/react-native: A framework for building native applications using Reactā}}
style={{marginTop: 0}}
/>
);
}
}
// Module name
AppRegistry.registerComponent(āReactNativeSampleā, () => ReactNativeSample);
From the above Iām loading the url into webView,
Here my question is it possible to get notified in iOS native code when ever user tap on some item from the loaded webView.
Can you please some one help me on this.
I donāt know the answer to this. You may want to ask this question on StackOverflow or the Discord channel where many React Native developers hang out. You can get more info on those support channels (and others) here - http://facebook.github.io/react-native/support.html
Thanks so much for your post, it helps a lot! Iām able to follow until the end except the last step of building project for Production. Seems that I can build and run successfully, but the script couldnāt build a main.jsbundle for me, and when I finally tried to load the āRatingā page, the app crashed, and the error tells me āNo url providedā, and as I said above, I couldnāt find the main.jsbundle anywhere. Any idea what happened here? Thanks again.
Check your Xcode build report and send over the error you see. It may be related to a previous forum question, I added a note to the post with instructions on updating the react-native-xcode script to fix that error.
Hi,
Thanks for the article. well explained and good to follow for native apps.
Can this apply for cordova project?. Any similar examples for cordova project?
I have requirement to add react native progressively in one of the existing cordova project which is already production live. In my existing cordova project, major portion is from web app and embedded via web view. now requirement is to replace one of web app function in react native.
My thought is below from this article.
can this follow?.
If Cordova can call a UIView then it should be able to launch a React view as thatās a subclass. I donāt know the internals of Cordova enough to answer how to keep the session alive. Again, I assume that if itās possible with a UIView, the same should apply for a React View.
Please make another one tutorial that integrates to existing android app. Iām struggling to find a good tutorial that can integrate react native to an existing android app
Iāll check and see if this is something the team wants to undertake. You may also want to check out the RWDevCon 2017 vault, I gave a tutorial talk and have a sample that shows how to integrate React Native in an iOS and Android app.
i just try to import
import React
but i am getting No such module āReactā
even my pod setup successfully
can you please hep me?
This tutorial is more than six months old, so questions are no longer supported at the moment for it. We will update it as soon as possible. Thank you! :]