Ionic Applications with Custom Scripts

Appcircle provides Ionic applications through custom scripts.

You can use the following project as an example for running Ionic builds in Appcircle:

GitHub - appcircleio/appcircle-sample-ionic: a Vue project with Ionic Framework

a Vue project with Ionic Framework. Contribute to appcircleio/appcircle-sample-ionic development by creating an account on GitHub.

github.com

The sample project is built with Vue though other Ionic application types can also be built in a similar manner. For the build, Capacitor is recommended, and this document is based on projects configured to be built with Capacitor in Android Studio or Xcode.

To build an Ionic application, first, add and configure it like a React Native application.

One important point to take note of is that capacitor-cordova-android-plugins folder is automatically added to the .gitignore file, but it is required during the build. The folder can be removed from the .gitignore or it can be regenerated during the build, though the former is recommended for a successful Fetch operation. For more information, you can refer to the following Git issue for Capacitor:

Android pipeline build error in Azure - could not read script 'cordova.variables.gradle' as it does not exist · Issue #1628 · ionic-team/capacitor

Description of the problem: I'm falling over with the above error at the 1st step when defining an Azure build of my Create React App + Capacitor + Android. I'm following these Azure Android instru...

github.com

You can then add the custom scripts before the build steps and run the build normally.

Android Custom Script for Ionic Builds

For Android, add the following script before the "Android Build" step.

set -e
set -x

cd $AC_REPOSITORY_DIR

npm install -g @ionic/cli
ionic capacitor copy android

iOS Custom Script for Ionic Builds

For iOS, add the following script before the "Xcodebuild for Devices" step.

set -e
set -x

cd $AC_REPOSITORY_DIR

npm install
-g @ionic/cli

ionic capacitor copy ios

Need help?

Get help from Appcircle's support team, or see how others are using Appcircle by joining our Slack Channel.

Slack

No description available

join.slack.com