Mobile Framework

Build a Mobile App Using Sencha CMD

The Sencha build operation processes the individual JavaScript application files and combines them into a single app.js file. A similar function is applied to the CSS styles that are processed and compiled into a single app.css file.

Overview

The mobile app build process is performed using the Sencha CMD tools. The Sencha build contains the following steps:

  1. The JavaScript source file loading dependencies are determined.
  2. The JavaScript source files are concatenated into a single app.js file.
  3. The app.js file is minified.
  4. The CSS for the app is generated from the app SASS files.
  5. The CSS file is minified and output to a app.css file.

Archibus provides a customized build script that performs these additional steps

  1. The language files are copied to the app deployment folders.
  2. The platform specific cordova.js files are linked and minified.
  3. The Web Central library files are linked and minified and copied to the app deployment folders.

Executing the build

Build property file

The archibus.properties file located in the ../mobile/src/build folder contains the configuration for the location of the Sencha SDK files. Set the sencha.src.dir property to the location of the Sencha SDK files in your environment.

The Archibus build script, build.xml, and supporting files are located in the .. /schema/ab-products/common/mobile folder. The following commands should be executed from that location.

Build commands

To build all apps for iOS, Android and Windows Phone platforms:

sencha ant build-all-mobile-apps

To build a single app for all platforms:

sencha ant -Dapp.name=AppLauncher build-app

Build output

The app build output is copied to the app deployment folders. The deployment folders are ../schema/ab-products/common/mobile/android , ../schema/ab-products/common/mobile/wp8 and ../schema/ab-products/common/mobile/ios . Each of these folders will contain a folder for each of the compiled apps.

Build error files

The build log file for each app is written to the application src folder. The log file format is AppName-build.log . For example, the Condition Assessment app log file is ConditionAssessment-build.log .

Linting the JavaScript files

Linting is a process that scans the JavaScript files and identifies potential code errors. The Archibus build.xml script contains a build task that lints the JavaScript files using JSHint.

To enable linting of the JavaScript files install node.js and JSHint as described in the Installation section. Set the lint.js.files property to true in the build.properties file.

Any errors or warnings noted by the JSHint program will be output to ../schema/ab-products/common/mobile/lint/jshint.log .

Running the lint task without building the mobile apps

The lint task can be run directly without building the app files by executing the command

sencha ant lint.apps

Building the apps for specific languages

The Archibus mobile apps support localization. The localized strings are contained in the various lang_*.js files. The language files for each of the supported languages are included in the build by default. Each of the language files is downloaded to the device when the app loads. The performance of the Archibus mobile apps can be improved by including only the languages required by your users in the build.

The archibus.properties file located in the ../mobile/src/build folder contains the language.include property. The language.include property determines the languages that are included in the build.

To produce a mobile build that includes only Spanish language strings set the property to language.include=es then build the apps.

.