I'm creating a bundle release in react native android. I create an apk using "assembleRelease" I tested the assets are there but when I try to bundle in "bundleRelease" there's no asset.
The image show that my assets directory.
This is my index.android.bundle. The BGAppPros is automatically generated.
In my android/app/build.gradle
code looks like this. I have a feeling this is the culprit " resourcesDirRelease "
In short I want an offline assets. but the bundle release is ibcompiled correctly.
project.ext.react = [
entryFile: 'index.js',
bundleInRelease : true,
resourcesDirRelease : 'src/release/res',
]
I solved my problem you need also check you'r script
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/
make sure its the right path when you calling the
resourcesDirRelease : 'src/release/res',
Related
I have problems integrating an external android sdk.
I was able to make a nativescript plugin using an aar but when I want to put a sdk in its place it does not work.
The structure of the plugin is as follows
(This does work)
plugin/
platforms/
android/
libs/
toasterlibrary-release.aar
Manifest.xml
index.js
package.json
(This doesn't work)
plugin/
platforms/
android/
libs/
toaster-library.apk
output.json
Manifest.xml
index.js
package.json
( index.js )
var application = require("application");
var context = application.android.context;
module.exports = {
showToast: function() {
var toaster = new com.example.toasterlibrary.ToasterMessage();
console.log(toaster.show(context,"Prueba de toast"));
}
};
The error is launched in the index.js when try to use toasterlibrary
ERROR TypeError: Cannot read property 'toasterlibrary' of undefined
I do not know what to do differently to include an apk in place of an aar
I'm trying to make a React Native android bundle and it works fine with --dev true but the following command hangs with --dev false
# this works
node --expose-gc --max_old_space_size=4096 ./node_modules/react-native/local-cli/cli.js bundle --verbose --platform android --dev true --reset-cache --entry-file index.js --bundle-output /usr/src/app/android/app/src/main/assets/index.android.bundle --assets-dest /usr/src/app/android/app/src/main/res/
# this freezes
node --expose-gc --max_old_space_size=4096 ./node_modules/react-native/local-cli/cli.js bundle --verbose --platform android --dev false --reset-cache --entry-file index.js --bundle-output /usr/src/app/android/app/src/main/assets/index.android.bundle --assets-dest /usr/src/app/android/app/src/main/res/
I've already tried adding the --verbose argument but the output is pretty brief
warning: the transform cache was reset.
Loading dependency graph, done.
Is there any way to get more information from the bundler? Or is the only way to do some printf debugging in the bundler.
FYI, i was hoping to reproduce the same problem using Haul but the Haul build passes with the following:
'./index.js 1:275593-275611\nCritical dependency: the request of a dependency is an expression\n ...
'asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).\nThis can impact web performance.\nAssets: \n ../assets/index.android.bundle (1.57 MiB)',
'entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.\nEntrypoints:\n main (1.57 MiB)\n ../assets/index.android.bundle\n',
'webpack performance recommendations: \nYou can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.\nFor more info visit https://webpack.js.org/guides/code-splitting/'
The issue was that I was running the build in a Docker container which was running on Hyperkit on my Mac. Hyperkit was created via command line with a 2G memory limitation which explains why the build would keep running until it hit the 2G memory limit and then fail silently.
I am currently doing an R&D in React Native.
I have a requirement where I need to add some modules(Basically code) in the app.
It is impossible in native iOS app to do so.
In React native apps using tools like AppHub and CodePush, we can push builds to production app.
There is a library React Native Auto Updater for downloading latest js bundle but it is deprecated now.
Using the above tools, I need to push the build.
I have a scenario where I want the app to fetch and download the bundle kept on a remote server.
So, How can I download JS Code on making a rest API call from App and refresh the app as per the new JS code?
My concern is regarding download of JS Code.
I am clear on the Auto Update of apps part.
Thanks in advance.
Eureka!
I accomplished this by doing the following:
Create an offline jsbundle Refer this link
react-native bundle --platform android --dev false --entry-file
index.android.js --bundle-output
android/app/src/main/assets/index.android.bundle --assets-dest
android/app/src/main/res/
Create a Rest API for downloading js bundle. Refer this link
I have used SpringBoot. Make sure you add this to your API produces "text/javascript"
Download the jsbundle in your app, store and get the path of the bundle.
Reset the path of bundle for React native in AppDelegate.m [for iOS] and in ReactApplication class [for Android]
Try the react-native-dynamic-bundle package: https://github.com/mauritsd/react-native-dynamic-bundle
Also, you can download the bundle using react-native-fs:
import RNFS from 'react-native-fs'
export const download = async (fromUrl, bundleName) => {
return RNFS.downloadFile({
fromUrl,
toFile: RNFS.DocumentDirectoryPath + `/${bundleName}.bundle`,
}).promise
}
Regards, Juan
I have the following line of code in my sample demo app to display a static image from asset folder.It works fine but the image disappears when i load offline bundle(Production apk).
<Image source={require('./assets/image/sample.png')} style={{width: 400, height: 450 , padding:10}}/>
and my project structure looks like this:-
After i tried to bundle the app for offline apk using the below command:-
react-native bundle --platform android --dev false --entry-file index.js --bundle-output [path for bundle output] --assets-dest [assets-path for image files]
I have the following structure in draw able folder
The confusion here is why react native changes the image name when bundling in this way.And i am not able to see the image after offline bundle please guide me on this as i have googled enough but not able to understand the behaviour.
Should not the image source be
require('./assets/image/sample.png')
instead of
require('./assets/sample.png')
I need to change the Entry file path to src/XXXApp.android.js instead of pointing to default index.android.js file. I want to keep the JS file in seperate ./src folder.
So that I made the change in ./android/app/build.gradle like
project.ext.react = [
bundleAssetName: "src/XXXApp.android.bundle",
entryFile: file("../../src/XXXApp.android.js"),
root: "../../../../",
inputExcludes: ["android/**", "./**"]
]
and in .\node_modules\react-native\react.gradle file like
def bundleAssetName = config.bundleAssetName ?:"src/XXXApp.android.bundle"
def entryFile = config.entryFile ?: "src/XXXApp.android.js"
But development package server always pointing to localhost:8081/index.android/bundle. . Manually i tried the URL: localhost:8081/src/XXXApp.android.bundle and it retrieve the data.
But in device debug loadJs always try the localhost:8081/index.android/bundle.
Please share the solution, proper place to update the entry file config for android. Appreciate in advance for your valuable solution.
In your MainActivity you can override getJSBundleFile() method of ReactActivity. Here you can specify your bundle file name along with the path. Code push use same method of override reactjs bundle path.