Configuring a NativeScript + Vue app for Android involves several steps to ensure the app is ready for development, testing, and final deployment. Here's a detailed guide:
- Ensure you have the following installed on your system:
- Node.js (v14 or later)
- NativeScript CLI:
npm install -g @nativescript/cli
- Android Studio with the following:
- Android SDK (API Level 21 or higher)
- Android Virtual Device (AVD) for testing
- JDK (Java Development Kit 11 or later)
- Create a new NativeScript + Vue project:
tns create my-app --vue cd my-app
- This sets up the project with a Vue framework ready for development.
- Add the Android platform:
This generates the necessary configuration files and directories under
tns platform add android
platforms/android
.
- Verify that the Android SDK is properly installed and accessible:
If any issues are detected, follow the provided instructions to fix them.
tns doctor
- Set the
ANDROID_HOME
environment variable:- Add this to your shell configuration file (e.g.,
~/.bashrc
or~/.zshrc
):export ANDROID_HOME=/path/to/android/sdk export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
- Reload your shell:
source ~/.bashrc
- Add this to your shell configuration file (e.g.,
- Inside the project directory, install additional dependencies:
npm install orbit-db ipfs-core
- If any plugins or native libraries are required (e.g., file system, WebRTC), add them using:
tns plugin add <plugin-name>
- Build the app to generate the APK:
tns build android
- This step compiles the app and prepares it for testing.
- To test on an Android device:
- Enable USB Debugging on your Android device.
- Connect the device to your computer via USB.
- Run the app:
tns run android
- To test on an emulator:
- Start an Android Virtual Device (AVD) using Android Studio.
- Run the app:
tns run android --emulator
- AndroidManifest.xml:
- Located at
App_Resources/Android/src/main/AndroidManifest.xml
. - Configure permissions (e.g., internet access, storage) and metadata for your app.
- Located at
- Gradle Build Configuration:
- Adjust
App_Resources/Android/app.gradle
for custom build options, such as minimum SDK version, target SDK, or specific dependencies.
- Adjust
- Icons and Splash Screen:
- Replace default assets in
App_Resources/Android/src/main/res/
with your app’s custom icons and splash screens.
- Replace default assets in
- Use NativeScript's debugging tools:
tns debug android
- Connect to Chrome DevTools for JavaScript debugging:
- Open
chrome://inspect
in Chrome and select your running app.
- Open
- Build a signed APK for release:
- Generate a signing key using
keytool
:keytool -genkey -v -keystore my-release-key.jks -keyalg RSA -keysize 2048 -validity 10000 -alias my-key-alias
- Configure the signing in
App_Resources/Android/app.gradle
:android { signingConfigs { release { storeFile file("my-release-key.jks") storePassword "your-password" keyAlias "my-key-alias" keyPassword "your-key-password" } } buildTypes { release { signingConfig signingConfigs.release minifyEnabled true shrinkResources true } } }
- Build the release APK:
tns build android --release --key-store-path my-release-key.jks --key-store-password your-password --key-store-alias my-key-alias --key-store-alias-password your-key-password
- Generate a signing key using
- Use the generated APK to:
- Install directly on a device for testing.
- Publish on the Google Play Store after meeting all requirements.
Would you like help with OrbitDB integration in this setup or optimizing the app for Android?