To create an Apache Cordova project for use with the Hybrid SDK (Kapsel), use the Cordova
command line tool.
Set up your development environment.
You must run the commands from a Windows command prompt, or a terminal window on iOS. See http://cordova.apache.org/docs/en/6.x/guide/cli/index.html.
- (Optional) Create a folder to hold your Hybrid SDK (Kapsel) Cordova projects.
For example, on Windows, C:\Documents and
Settings\<your_account>\Kapsel_Projects, or on OS X,
- (Optional) Open a Windows command prompt or terminal and navigate into the project folder you
- At the command prompt, enter:
cordova create <Project_Folder> <Application_ID>
Use the appropriate delimiter for path names.
This command may take a few minutes to complete, as an initial download of the
template project that is used is downloaded to
C:\Users\user\.cordova on Windows, or
~/users/user/.cordova on Mac.
The parameters are:
- (Required) <Project_Folder> – the directory to generate for
- (Optional) <Application_ID> – must match the Application ID
as configured on SAP Mobile Platform Server for the application, which is
reverse-domain style, for example, com.sap.kapsel.
cannot be too simple. For example, you can have "a.b" for an ID, but you
cannot have "MyApplicationId." The ID is used as the package name (name
space) for the application and it must be at least two pieces separated by a
period, otherwise, you will get build errors.
- (Optional) <Application_Name> – name for the
When installing plugins, you need to specify a path using the
argument to a location where the local plugin
can be found. For
cordova plugin add kapsel-plugin-logon --searchpath $KAPSEL_HOME/plugins
In this example, you create a project folder named LogonDemo
in the Kapsel_Projects directory. The Application ID is
"com.mycompany.logon" and the application name is "LogonDemo." Running
cordova -d allows you to see the progress of the project
cordova create ~\Kapsel_Projects\LogonDemo com.mycompany.logon LogonDemo
Your new project includes scripts to build, emulate, and deploy your
Note All of the Cordova command line interface commands operate against the current
folder. The create command creates a folder structure for your
Cordova projects while the remaining commands must be issued from within the
project folder created by create.
- To add the platform, change to the folder you created in the previous step:
This OS X example adds the Android , iOS, and Windows platforms.
cordova platform add ios android windows
A new plugin, cordova-plugin-whitelist
, is available in
Cordova 5.x. This plugin is added by default when creating a new project. To
configure this plugin, you must add a Content Security Policy. If not configured
correctly, this plugin might introduce errors and warning messages. See https://github.com/apache/cordova-plugin-whitelist
Note Android is supported on both Windows and OS X, but iOS is supported only on OS
Note You must add the platform before you add any Hybrid SDK (Kapsel)
The project directory structure is similar to this:
| |-- android/
| `-- ios/
| |-- android/
| `-- ios/
- .cordova – identifies the project as a Cordova
project. The command line interface uses this folder for storing its lazy
loaded files. The folder is located immediately under your user’s home
folder (On Windows, c:\users\user_name\ , and on
- merges – contains your Web application assets, such as
in this folder override matching files in the www/
folder for each respective platform.
- www – this folder contains the main HTML, CSS, and
file is the default page of the application. Once you finish editing your
project's files, update the platform specific files using the
cordova -d -prepare command.
- config.xml – the config.xml file
in the root directory contains meta data and native application information
needed to generate the application.
- platforms – native application project structures are
contained in subfolders for the platforms you added to your application.
- (Optional) You can test your Cordova project by opening it in the respective development
environment, for example, Xcode or Android Studio, and running it on the simulator or
emulator. If you are going to import your project into Android Studio, you must run
cordova build android.
- Add the plugins. See the detailed instructions for adding each plugin in Hybrid SDK
(Kapsel) Plugins. For example, to add the Cordova console plugin and the
Hybrid SDK (Kapsel) Logon plugin on Windows, enter:
cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-console.git
cordova plugin add C:\SAP\MobileSDK3\KapselSDK\plugins\logon
Note The path you enter to the Hybrid SDK (Kapsel) plugin must be the absolute path
(not relative path).
- Edit the Web application content in the project's www folder and use the
cordova prepare command to copy that content into the Android,
iOS, and Windows project folders:
cordova prepare android
cordova prepare ios
cordova prepare windows