Where is the right place to configure the APP name?

Issue

Each Ionic project has a project configuration file ionic.config.json where you can configure the human-readable name of the app:

{
  // The human-readable name of the app.
  "name": "My App",

  // The project type of the app. The CLI uses this value to determine which
  // commands and command options are available, what to output for help
  // documentation, and what to use for web asset builds and the dev server.
  "type": "angular",

  // The App ID for Ionic Appflow.
  "id": "abc123",

  // Configuration object for integrations such as Cordova and Capacitor.
  "integrations": {
    "cordova": {
      ...
    }
  },

  // Hook configuration--see the Hooks section below for details.
  "hooks": {
    ...
  }
}

Using capacitor gives us another opportunity to place an app name:

{
  // The package name for Android and the bundle identifier for iOS.
  "appId": "com.company.appname",

  // Your app's name.
  "appName": "Capacitor Kitchen Sink",

  // Sets the directory of your built web assets. This is the directory that will be
  // used to run your app in a native environment.
  "webDir": "www",

  // The JavaScript package manager to use, either npm or yarn.
  "npmClient": "npm",
  ...
}

Where is the right place for the app name?

Thanks in advance

Solution

Capacitor works with any framework, not just with Ionic, so the app name should be in the capacitor.config.json.

But as you said, Capacitor embraces the idea of "Code once, configure everywhere", so that appName is used only when you add the ios or android platforms, once you have added them you have to change the name from Xcode for iOS apps or from Android Studio for Android apps.

Answered By - jcesarmobile