(Ionic + Capacitor + Android Studio Build Guide)


1. Introduction

SmartOrderBookingApp ek hybrid mobile application hai jo Ionic + Capacitor framework par develop kiya gaya hai.

Ye documentation cover karegi:

  • Development environment setup

  • Build and deployment steps

  • Versioning guidelines

  • Play Store release process

  • Common troubleshooting


2. System Requirements

Component Recommended Version
Node.js v18+ (LTS preferred)
npm Latest (ships with Node.js)
Java JDK v17 (LTS)
Android Studio Latest (with SDK 34)
Gradle Bundled with Android Studio
Ionic CLI Latest
Capacitor v6+

⚠️ Note: Outdated Java or Android SDK versions sabse common issues create karte hain.


3. Project Setup

3.1 Clone & Install

git clone <repo-url>
cd SmartOrderBookingApp
npm install

3.2 Ionic Build

npx ionic build
npx cap copy
npx cap sync

3.3 Open in Android Studio

npx cap open android

4. JAVA_HOME Configuration

4.1 Temporary (current CMD session only)

set JAVA_HOME=C:\Program Files\Java\jdk-17

4.2 Permanent (recommended)

  1. Windows → Search → “Environment Variables”

  2. Add System Variable:

    • Name: JAVA_HOME

    • Value: C:\Program Files\Java\jdk-17

  3. Add %JAVA_HOME%\bin to PATH.

✅ Verify:

echo %JAVA_HOME%
java -version

5. Build Process

5.1 Development Build

npm install
npx ionic build
npx cap copy
npx cap sync

5.2 Debug Build (for emulator/device)

cd android
gradlew clean
gradlew assembleDebug
  • Output: android/app/build/outputs/apk/debug/app-debug.apk

5.3 Clean Build (without Gradle Daemon)

cd android
gradlew clean --no-daemon
gradlew assembleRelease --no-daemon --stacktrace

6. Version Management (Play Store Requirement)

File: android/app/build.gradle

defaultConfig {
applicationId "com.smart.orderapp"
minSdkVersion 21
targetSdkVersion 34
versionCode 4 // Increment +1 for every release
versionName "1.0.3" // Update for user display
}
  • versionCode → Must be unique & incremented each release (Play Store validation).

  • versionName → Human-readable version (shown to users).


7. Release Build (AAB for Play Store)

Step 1: Generate AAB

cd android
gradlew bundleRelease

Step 2: Output File

android/app/build/outputs/bundle/release/app-release.aab

Step 3: Upload to Play Store

  1. Login → Google Play Console

  2. Select App → Production → Create New Release

  3. Upload .aab file

  4. Add release notes

  5. Review & submit for Google approval


8. Troubleshooting

8.1 npm not recognized

  • Reinstall Node.js

  • Check:

node -v
npm -v

8.2 JAVA_HOME not set

set JAVA_HOME="C:\Program Files\Java\jdk-17"

8.3 npx tsc --noEmit --error

  • Run:

npx tsc --noEmit
  • Fix TypeScript errors shown in src/*.ts files.

8.4 Plugin Usage Check

Check if xlsx, jspdf, or autotable used in code:

findstr /S /N /I "xlsx jspdf autotable" src\*.ts src\*.tsx src\*.js src\*.jsx

8.5 Emulator not working

  • Ensure Android Studio SDK installed

  • Run:

npx cap open android

9. Deployment Checklist

✔ JAVA_HOME set
✔ Ionic build successful
✔ Version updated (versionCode +1)
✔ AAB generated
✔ Uploaded on Play Console
✔ Release notes added


10. Useful Commands

Command Purpose
npm cache clean --force Clear npm cache
gradlew clean Clean Android build
gradlew assembleDebug Debug APK build
gradlew bundleRelease Release AAB build
npx cap open android Open in Android Studio