Files to be required for generating apk file in React native - javascript

I've started to learn react native and I've tried some sample app.The app is installed in emulator and working properly,and I would to share this app with my friends so I've created apk file using generating signed apk
In that reference link they told that,
cd android && ./gradlew assembleRelease
this command (assembleRelease) will bundle all the javascript.Are javascript files alone enough to create apk file?We are running this command inside android folder,wont it take java files?Can anyone please explain in detail what will happen and what are the files bundled after giving the above command.

Hope this URL will help.
https://en.wikipedia.org/wiki/Dalvik_(software)
Look at Architecture part too.

Once keystore file is generated and linked in ~/.gradle/gradle.properties and android/app/build.gradle, running cd android && ./gradlew assembleRelease from root folder (or ./gradlew assembleRelease from android folder) will bundle the app with all necessary files and generate the apk.
You will find the signed apk (app-release.apk) in android/app/build/outputs/apk folder
Hope this helps

Related

Reduce the react native ios/android size folder

Need help to reduce the react-native file size, my repo is getting heavy.
cd ios
xcodebuild clean
cd android
./gradlew clean
./gradlew cleanBuildCache
I tried both commands but still the same.
node_modules is already in .gitignore
No need to add android/app/build which occupies most of space. These get generated when "run android" command is executed.

Could not list contents of 'third-party/glog-0.3.4/test-driver'. Couldn't follow symbolic link

I have a project build on react-native version 0.55.4. It was woking fine on old system. I have to change system due to some reasons. I setup on new system, I am able to run project using react-native run-android but when building a signed APK using ./gradlew assembleRelease I am receiving following error.
Task :app:processReleaseGoogleServices
Parsing json file:
<Project-Directory>/android/app/google-services.json
FAILURE: Build failed with an exception.
What went wrong:
Could not list contents of
'<Project-Directory>/node_modules/react-native/scripts/third-party/glog-0.3.4/test-driver'. Couldn't follow symbolic link.
I know this issue is already on stack overflow Invalid symlink in node_modules error when trying to deploy to simulator (RN 0.45). I have tried it. I have also tried following github question.
https://github.com/facebook/react-native/issues/11212
https://github.com/facebook/react-native/issues/14417
https://github.com/facebook/react-native/issues/14548
https://github.com/facebook/react-native/issues/14464
I have also tried following things.
Deleting node modules and reinstalling them
Deleting .bin folder in node modules
Deleting react-native/third_party folder in node modules.
Copying node modules from older system.
Copying third-party and glog-0.3.4 from older system.
Deleting test-driver file inside third-party folder.
Unlinking test-driver file inside third-party folder.
Installing automake-1.16 and creating a new alias of test-driver file inside third-party folder.
My java version is 1.8.0_201. My android studio version is 3.3.2. Projects react native version is 0.55.4. My mac os version is 10.14.4. My x code version is 10.2.
Please help.
Thanks in advance.
Unlinking as below and restart with the cache cleaned
In project folder:
unlink ./node_modules/react-native/scripts/third-party/glog-0.3.4/test-driver
and then stop js server and run:
npm start -- --reset-cache
It should work

No Android or IOS specific files on React Native Project Folder

I followed React Native Official Doc Step By Step from
https://facebook.github.io/react-native/docs/getting-started.html
and initialized a project and got the following files (except splash.js and style.js)
For learning React Native I was following a youtube video and in there the project folder contained some android and ios specific files.
But I ran the project by creating a simple splash screen and it's running on both android or ios file.
As a beginner I'm so confused. So How can i get those files.
For Example,
index.ios.js
Index.android.js
just double check that you follow this instructions https://facebook.github.io/react-native/docs/getting-started.html and not something else.
Now what i am doing is
1) npm install -g react-native-cli
2) react-native init AwesomeProject
3) cd AwesomeProject
4) react-native run-ios
you are using expo if you want native code try Building Projects with Native Code tab on https://facebook.github.io/react-native/docs/getting-started.html#getting-started

React native init android,ios and app folder missing

Missing android,ios & app folders and index js files
I'm using react native v 0.1.10 in windows 7 OS
We can generate android and ios folder by using upgrade
Run react-native upgrade to generate /ios and /android folders again.
Run react-native link for any native dependency. (if needed)
Finally run
react-native run-ios
or
react-native run-android
Probably you created your project using create-react-native-app, which is an even more simplified toolchain.
You should probably eject if you need android/ios native configs or something.
Please take a look at this doc: https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md
Try this to generate the Android and iOS folder without change version
react-native eject
react-native link
Install a new file using powershell instead of cmd.
Run following commands
1. npx react-native eject
After running above command you can see output in console as follows
info Generating the iOS folder.
info Generating the Android folder.
Next below command
2. npx react-native run-android
Try update ur nodejs and npm to the latest version then run everything again starting from init
npm run eject
next we will get some couple of questions,
? how would you like to eject from create-react-native-app
React-Native : I'd like a regular react native project
? What should your app appear as on a users's home screen? _Your wish____
? What should your Android Studio and Xcode projects be called? rncourse
After Ejected Successfully the project structure will change, added folders android and ios.
happy coding

XCode Build not updating JS and HTML

I am using XCode 5.0.2 and Cordova 3.4.0-0.1.3 - What I find is after creating the project using the Cordova CLI and opening in XCode, no changes to the index.html file and index.js file are ever carried over to the simulator when I click run.
I have to open terminal and issues a Cordova Build command and then run the simulator and it works
I followed all the instructions here:
Phonegap - developing and launching app on simulator
xcode 4 + phonegap ... not update JS upon build?
And none of it works! any one a have a solution to this, because having to switch back and forth is becoming a pain.
You can add a pre-action script to your XCode project's build. To do this:
Select Product > Scheme > Edit Scheme from the menu (or ⌘ < on keyboard)
Select Build > Pre-actions from the left
Click + and select "New Run Script Action"
Add a script like this:
cd /path/to/your/cordova/project/
cordova prepare ios > xcode-prepare-results.txt
Now XCode should always run cordova prepare before building your project so you don't have to jump to terminal. You can see the output of prepare in the file xcode-prepare-results.txt.
Note, that depending on how your cordova executable is set up and which shell you use, you might have to either change the shell or modify your PATH in order for the script to find cordova.
So after much searching I seem to have found a solution that works, here is what I did. After looking at other Stackoverflow questions I found someone that said this worked for them.
Find the file called copy-www-build-step.sh.
Mine was in
[project_folder]/platforms/ios/cordova/lib/copy-www-build-step.sh
In that file, find the lines beginning rsync -a "...
Add -c to the rsync lines, so they ready rsync -a -c "...
Well I tried that and it did not work on its own. I also tried the answer from Ville and that pulled closer but no cigar. Finally I took what the command from Ville and put it in the copy-www-build-step.sh file
so my top line is now
cd /path/to/your/cordova/project/
cordova prepare
SRC_DIR="www/"
DST_DIR="$BUILT_PRODUCTS_DIR/$FULL_PRODUCT_NAME/www"
COPY_HIDDEN=
ORIG_IFS=$IFS
IFS=$(echo -en "\n\b")
.....
.....
.....etc etc
And now I make change , and click run , bam all is updated. I hope this helps someone else.
Other answers in this thread either didn't work for me or screwed up cordova plugins e.g. InAppBrowser, so i finally came up with this:
Edit the file copy-www-build-step.sh and add the following row in the beginning:
cp -fR ../../www/ www/
so it should look like:
...
cp -fR ../../www/ www/ # new code
SRC_DIR="www/"
...
This way your code will be updated properly and your plugins will work
I also edited the copy-www-build-step.sh file, however you don't want to use an absolute path from your User folder. If you are working with other developers you would have to change that every time you check out code.
It's not a big deal, just change:
SRC_DIR="www/"
To:
SRC_DIR="../../www/"
UPDATE
Worked for me on Cordova and Phonegap.
To have the source files automatically copied from the www source directory to the platforms/ios/www directory when you click the Run button in XCode:
In XCode, choose Product->Scheme->Edit Scheme...
Expand the triangle for Build->Pre-actions
Click the "+" to create a new Pre-action
You can leave the "Shell" setting blank.
Set "Provide build settings from" to the project you are building. This is important.
In the script area enter:
cd ${PROJECT_DIR}/../..
echo "--- Start ---" > xcode-prepare-ios-results.txt
echo "Running cordova prepare ios command..."
pwd >> xcode-prepare-ios-results.txt
cordova prepare ios --verbose >> xcode-prepare-ios-results.txt
echo "--- Finished ---" >> xcode-prepare-ios-results.txt
This works for me with XCode 8.2 and Apache Cordova 6.x
I suggest you clean before build your xcode project. And one more thing, make sure you build again your project using cordova build, not inside xcode because it's totally different.
cordova build yourproject
#Ksliman
I modified you code a bit to work on my system and make slight bit more generic.
top of file copy-www-build-step.sh
## New Code Begin ###
cd ../../
PATH=${PATH}:/usr/local/bin
cordova prepare ios
## New Code End ###
SRC_DIR="www/"
simply type:
cordova prepare
on your terminal and run your project again in Xcode
Simple solutions is to build the app with cordova using:
sudo cordova build ios
Then go to xcode > Product > Clean
Then go to xcode > Run (Play Button)
Run "cordova prepare ios" during the building phases:
Open Xcode.
Select your project.
Go to "Build Phases".
Go on "+" to add a "New Run Script Phase".
Move this section before "Copy www directory".
Add the following lines (for Mac):
cd /Users/*/YOUR_PROJECT_FOLDER (Change your project folder)
/Users/*/.nvm/versions/node/v?.?.?/bin/node node_modules/cordova/bin/cordova prepare ios (Change the path to node version)
After "Play" the www-folder will automatically refresh!
All I had to do was to include the full absolute src path for my project. For example:
From your project directory, vim platforms/ios/cordova/lib/copy-www-build-step.sh
change SRC_DIR to the absolute path of your www, SRC_DIR="/Users/michael/Documents/Development/SampleMobileApp/www/"
Save, build, and you should be good to go.
I found that sometimes Cordova gets confused... you need to do a "cordova platform rm ios" (just leave your plugins alone), and then do a "cordova platform add iOS", which will reinstall all your plugins into your platform... then try your build again.
Every time I use cordova build its overrides content in my platform specific www file. So I use cordova compile instead.
From help:
compile <platforms> compiles platform project without preparing it
It is important to just compile the changes not to build entire projects especially if you creating mobile app for many platforms and you have to do some platform specific improvements.
For me, there was an error in my code. I simply needed to run npm start to locate it.
If you are directly changing html from the Xcode, then you should change the code/html of the staging folder, not main folder
In the staging folder you will get same structure which you have in the main folder, but it will reflected directly in the xcode (iOS) build
Staging folder
Note: The changes you made in the xcode will be replace when you build again from the cordova build/run, so please copy your changes in the main folder before doing firing cordova commands
You can get more information from this answer: Purpose of Staging folder in PhoneGap 3.4? Only changes to index.html in this folder get recognized?
This is the correct solution taken from:
Cordova + Xcode 7.3 (html + Javascript) not changed or updated when build and emulate

Categories