I want to generate a standalone APK with bundled assets (e.g: PNG images). The application must work with no network communication.
I read Offline support documentation and adjust the assetBundlePatterns
property.
I manage to build an APK on my computer using turtle-cli
tool (i.e. without using expo servers) and I can deploy it on my Android phone:
# export files
expo export --dev --public-url http://127.0.0.1:1234
# run a simple HTTP server listening on port 1234 to provide files
cd dist/
python3 -m http.server 1234 --bind 127.0.0.1
# generate the APK
EXPO_ANDROID_KEYSTORE_PASSWORD="my-keystore-password" \
EXPO_ANDROID_KEY_PASSWORD="my-key-password" \
turtle build:android \
--type apk \
-o dist/my-app.apk \
--keystore-path "private/my-android-signing.keystore" \
--keystore-alias "my-app-signing-key" \
--public-url http://127.0.0.1:1234/android-index.json
--type apk
# install the APK on my Android phone
adb devices
adb install -r dist/my-app.apk
Then, I disable all network connection on my phone and run the application.
The application starts but no bundled image is shown!
Besides, I get the following message when trying to display a simple image:
Error: Failed to connect to /127.0.0.1:1234
Thus, the image is not loaded from the APK ; the application tries to get it from the publish server! AFAIK, this is not compliant with the Offline support documentation.
When I unpack the APK, I can verify that the required image has been bundled in the APK file.
Am I doing something wrong? Is it a known bug? Does anybody manage to display bundled images without using an initial network connection to load them?
I have just upgraded all my project dependencies but it does not solve my issue…
Hereby some extracts of different files:
my-project/App.js file:
import React from 'react';
import { View, Image, Text } from 'react-native'
import { Asset } from 'expo-asset';
export default class App extends React.Component {
render() {
const imageURI = Asset.fromModule(require('./assets/images/logo.png')).uri;
const localURI = Asset.fromModule(require('./assets/images/logo.png')).localUri;
return (
<View style={{ flex: 1 }}>
<Image source={require('./assets/images/logo.png')} />
<Text>Image URI : {imageURI}</Text>
<Text>Local URI : {localURI}</Text>
</View>
);
}
};
When running the application, the display is:
Image URI : http://127.0.0.1:1234/assets/1b5cf22759f7c052e9981fff94db78d0
Local URL :
The bundled image in the APK is : /assets/asset_1b5cf22759f7c052e9981fff94db78d0.png
my-project/app.json file:
{
"expo": {
...
"sdkVersion": "36.0.0",
...
"version": "1.0.0",
...
"updates": {
"enabled": false
},
"assetBundlePatterns": [
"./assets/images/*"
],
"android": {
"package": "com.mycompany.myapp"
},
...
}
}
The image that should be bundled is here: my-project/assets/images/logo.png
Dependencies and versions:
"expo": "^36.0.0",
"react": "16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.1.tar.gz",
$ turtle --version
0.13.6
$ expo diagnostics
Expo CLI 3.11.2 environment info:
System:
OS: Linux 4.19 Debian GNU/Linux 10 (buster) 10 (buster)
Shell: 5.0.3 - /bin/bash
Binaries:
Node: 12.13.0 - ~/software/node/bin/node
Yarn: 1.21.1 - /usr/bin/yarn
npm: 6.13.4 - ~/software/node/bin/npm
npmPackages:
expo: ^36.0.0 => 36.0.1
react: 16.9.0 => 16.9.0
react-native: https://github.com/expo/react-native/archive/sdk-36.0.1.tar.gz => 0.61.4
react-navigation: ^4.0.10 => 4.0.10
npmGlobalPackages:
expo-cli: 3.11.2