Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Niurka77/tf-app/llms.txt

Use this file to discover all available pages before exploring further.

capacitor.config.json is the central configuration file that bridges TF-App’s Vite web build to its Android native wrapper. Capacitor reads this file during cap sync and cap build to determine where to find your compiled web assets, how to identify the app on the device, and which plugin behaviors to apply at launch. Every change to this file should be followed by npx cap sync so the native Android project stays in sync.

Full Configuration

{
  "appId": "com.example.app",
  "appName": "tf-app",
  "webDir": "dist",
  "server": {
    "android": {
      "cleartext": true
    }
  },
  "plugins": {
    "SplashScreen": {
      "launchShowDuration": 2000,
      "launchAutoHide": true,
      "backgroundColor": "#1E88E5",
      "androidSplashResourceName": "splash",
      "androidScaleType": "CENTER",
      "showSpinner": false,
      "androidSpinnerStyle": "horizontal",
      "iosSpinnerStyle": "small",
      "spinnerColor": "#FFFFFF",
      "splashFullScreen": true,
      "splashImmersive": true,
      "layoutName": "launch_screen",
      "useIconBackground": true,
      "webLinearGradient": "linear-gradient(135deg, #1E88E5 0%, #0D47A1 100%)"
    }
  }
}

Top-Level Fields

appId
string
required
The Android package identifier for TF-App. This value becomes the applicationId in android/app/build.gradle and the namespace in the Android project. It must follow reverse-domain notation and be globally unique on the Google Play Store.Current value: com.example.app
appName
string
required
The human-readable name displayed on the device home screen and in the app drawer. This value is written to android/app/src/main/res/values/strings.xml as app_name during cap sync.Current value: tf-app
webDir
string
required
The path (relative to the project root) where Capacitor looks for compiled web assets to copy into the Android WebView. This must match Vite’s build.outDir, which defaults to dist. Running npm run build populates this directory before every native build.Current value: dist
server
object
Controls how the Capacitor web server behaves inside the Android WebView. See Server Configuration below for details on the android.cleartext flag.
plugins
object
A map of Capacitor plugin names to their configuration objects. TF-App currently configures the SplashScreen plugin here. See Plugin Configuration for an overview, and the Splash Screen page for the full option reference.

Changing the App ID

Before publishing TF-App to the Play Store, replace com.example.app with a real reverse-domain identifier that you own (e.g., com.yourcompany.tfapp).
1

Update capacitor.config.json

Change the appId field to your chosen identifier:
{
  "appId": "com.yourcompany.tfapp",
  "appName": "tf-app"
}
2

Update android/app/build.gradle

Open android/app/build.gradle and update both namespace and applicationId inside defaultConfig to match:
android {
    namespace "com.yourcompany.tfapp"
    defaultConfig {
        applicationId "com.yourcompany.tfapp"
    }
}
3

Sync the native project

Run npx cap sync from the project root to propagate the new ID into all generated Android files:
npm run build && npx cap sync android
Changing appId after your app is already published on the Play Store creates a new, separate listing. The original listing cannot be updated to a different app ID. Plan your identifier before your first release.
AndroidManifest.xml uses ${applicationId} as a placeholder — for example, in the FileProvider authorities attribute — so it does not need to be edited manually when you change the app ID. Gradle substitutes the value automatically at build time.

Server Configuration

The server block controls runtime behavior of the embedded web server that Capacitor uses to serve your Vite app inside the Android WebView.
"server": {
  "android": {
    "cleartext": true
  }
}
FieldTypeDescription
server.android.cleartextbooleanWhen true, allows the WebView to load resources over plain HTTP. Required if your development API server does not use HTTPS.
Disable cleartext before Play Store submission. Setting cleartext: true in production makes TF-App vulnerable to man-in-the-middle attacks and will likely trigger a Play Store policy warning. Set it to false and ensure all API endpoints use HTTPS before building a release APK or AAB.
"server": {
  "android": {
    "cleartext": false
  }
}

Plugin Configuration

The plugins object in capacitor.config.json is the declarative way to configure Capacitor’s official plugins without writing native code. Each key maps to the plugin’s class name, and the nested object contains that plugin’s accepted options. TF-App currently configures one plugin at the top level:

SplashScreen

Controls the native Android launch screen shown while the WebView loads. Options include display duration, background color, image scaling, and immersive mode. Full reference on the Splash Screen configuration page.
Plugin configuration in capacitor.config.json applies at the JavaScript layer. Some plugins also require changes to native files (e.g., AndroidManifest.xml or res/ drawables). Always consult the plugin’s official documentation after adding a new entry here.

Build docs developers (and LLMs) love