Self-contained React Native app possible? - react-native

I built a react-native app for Windows (https://github.com/Microsoft/react-native-windows). The app runs fine on my development machine, but if I copy the EXE (and DLL dependencies) to another machine and run, I get the error message
Unable to Download the JS bundle. Did you forget to start the
development server or connect your device?
Is there a way to build a self-contained app that does not depend on a "development server"?

React Native Windows Environment Setup (with Typescript)
Download and Install Visual Studio 2017 Download Link
Download and Install Visual Studio Code Download Link
Download and Install NodeJS Download Link
Install React Native CLI
npm i -g react-native-cli
Install TypeScript
npm i -g typescript
Create your project
react-native init --version="0.55.0-rc.0" MyApp --template typescript && node MyApp/setup.js
Change project directory MyApp
cd MyApp
Install the React Native Windows CLI Plugin
npm i --save-dev rnpm-plugin-windows
Run the Windows initialization command
react-native windows --windowsVersion 0.55.0-rc.0
Open project MyApp.sln file in Visual Studio
Follow the prompts to install the Windows 10 SDK v. 10.0.14393.0
If prompted, select Developer Mode in the Settings window under "Use developer features" and approve the Certificate Installation request. Enable "Developer mode" to allow the custom application to run
Install windows build tools (run in Windows Power Shell)
npm i -g --production windows-build-tools
Run your application
react-native run-windows
Prompt Windows PowerShell Installing Certificate: Enter Y to install
Prompt window: Allow Access to windows firewall

You can bundle your JS code using
react-native bundle --platform windows --entry-file index.windows.js
--bundle-output windows\myapp\ReactAssets\index.windows.bundle
--assets-dest windows\myapp\ReactAssets
--dev false
If you want to upload to store then you can follow
https://learn.microsoft.com/en-us/windows/uwp/packaging/packaging-uwp-apps#create-an-app-package

Related

How do i convert a React Native template into a project and run it?

This is the template i am trying to use,
https://www.instamobile.io/app-templates/food-app-template
https://github.com/instamobile/recipes-app-react-native
I have downloaded it into a folder named FoodApp and ran npm install.
Then i run npx react-native start. After that I open another command prompt and run npx react-native run-android. It shows error
error Android project not found. Are you sure this is a React Native
project? If your Android files are located in a non-standard location
(e.g. not inside 'android' folder), consider setting
project.android.sourceDir option to point to a new location. Run CLI
with --verbose flag for more details.
This app uses the Expo toolset and requires expo-cli to be installed before it can be ran. You can install it with npm install -g expo-cli followed by expo start to run the app.

Building and running a finished project on iOS

I have a project downloaded from GIT in React-Native
What steps should I take to run the application in Debug mode on iOS:
on Emulator
on my Device
Firstly, install the node_modules using npm or yarn as per the git project readme.
If your react native version is above 60, it get default cocoapods support. Move to ios folder and run pod install from commandline.
Now you have 2 options to run the project:
1. Navigate to ios folder and run the command 'react-native run-ios'.
2. Open Xcode,Navigate to ios folder and open projecname.xcworkspace file. You can see the run command on top-left of the IDE.

react-native run-android not working on ubuntu 16.04

i have a problem with react native in ubuntu, i have installed,
java jdk 8 (both javac --version) as well as echo $JAVA_HOME gives the proper output.
I have also installed android studio and set the android environment variables as well as the tools and echo $ANDROID_HOME gives output of the sdk location.
I have also installed gradle version 4.4.
I am unable to start the android app using react-native run-android. can any one let me know if i have missed something during installation.
And react-native as well as android studio works fine as I am currently using react-native start to start the metro builder as well as the other react-native cli commands. also android studio and gradle is also able to generate debug as well as release apks with no problems.
The error i get,
Scanning folders for symlinks in /home/igate-naveed/Documents/ReactNative/mobile-app-android/node_modules (16ms)
Starting JS server...
Building and installing the app on the device (cd android && ./gradlew installDebug)...
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html
First of all you need to create a project like this:
react-native init myProjectName
Then, start an emulator from Android Studio... Afterwards:
npm install && npm start
in your project directory, and from another terminal, inside your project directory, run :
react-native run-android
Is this working?
Instead of using the npm install manager, I used yarn and it worked for me. In your project directory, just do:
(project-directory)$ yarn
Update the gradle version.
Create new project:
react-native init projectname
Uninstall the npm pack.
Reinstall the npm pack again.
npm start
react-native start
react-native run-android

Nativescript vue, how to get the .apk file?

By following nativescript docs, installed all dependencies and tns doctor dont find any error.
and followed a tutorial and ran the following commands,
npm install -g #vue/cli #vue/cli-init
vue init nativescript-vue/vue-cli-template hello-vue
cd hello-vue
npm install
All sets fine and then i did my coding for an simple app then i ran below command:
npm run watch:android
This deploy the app in my connected android phone.
so my question is how can i get the apk file, so that i can send to another person?
Note: sidekick even not opening my folder. and when running tns build android shows No project found at or above 'C:\wamp64\www\newapp' and neither was a --path specified.
For building the apk for android, use the following command:
tns build android --release --key-store-path <path-to-your-keystore> --key-store-password <your-key-store-password> --key-store-alias <your-alias-name> --key-store-alias-password <your-alias-password>
Lots more info here : https://docs.nativescript.org/tooling/publishing/publishing-android-apps
If you want to get the debug apk using tns debug android --bundle, it will be located here :
<your project folder>/platforms/android/app/build/outputs/apk/debug/app-debug.apk
If you are having trouble running tns, install nativescript globally using:
npm i -g nativescript
And follow the simple prompts.
I'm not sure if this is what you're looking for (it sounds like you want a debug.apk instead of an output.apk), but you might want to look at the documentation for publishing an Android app.

Getting error while creating a new Project

I'm new to reactnative. I have followed steps to install reactnative properly but, while creating a new project, I'm getting an error. I'm using Windows 7 64 bit with i3 processor.
c:\ReactNativeProjects>react-native init AwesomeProject
Command npm install --save --save-exact react-native failed.
My Folder contains only one file
Since you are starting to use React Native, consider using Expo, I've used it and it makes developing, debugging, testing and deploying to the apple store and google play easier.
According to the official docs:
Expo is the easiest way to start building a new React Native
application. It allows you to start a project without installing or
configuring any tools to build native code - no Xcode or Android
Studio installation required (see Caveats).
Assuming that you have Node installed, you can use npm to install the
Expo CLI command line utility:
npm install -g expo-cli
Then run the following commands to create a
new React Native project called "AwesomeProject":
expo init AwesomeProject
cd AwesomeProject
npm start
This will start a development server for
you.
I've answered a question in SO for the steps and what happens when you build your .apk and .ipa files using Expo, have a look at that as well.
These are my steps to get rid of this error:
Please upgrade your npm
npm install -g npm#latest
Run npm cache clean command in Command prompt ( With some element of doubt for cache presence)
3.Ran react-native init in command prompt as Administrator (on Windows OS), hoping works well with sudo react-native init on Mac OS
If still problem persist make sure that you have followed each and every step mentioned in Documentation i.e. installed JDK, PYTHON, NODE.
Refer to this link For windows