Using the MobileFirst CLI in Eclipse
improve this page | report issueOverview
Using the Cordova CLI you can create and manage your Cordova applications. You can also achieve the same in the Eclipse IDE by using the THyM plug-in.
THyM provides support for importing and managing Cordova projects in Eclipse. You can create new Cordova projects, as well as import existing Cordova projects. You can also install Cordova plug-ins into your project through this plug-in.
Learn more about THyM in its official website.
The MobileFirst Studio plug-in for Eclipse exposes the various MobileFirst commands in the Eclipse IDE. Specifically, it provides the following commands: Open Server Console, Preview App, Register App, Encrypt App, Pull App, Push App, Update App.
This tutorial walks you through installing the THyM and MobileFirst Eclipse plug-ins.
Prerequisites:
- MobileFirst Server to run locally, or a remotely running MobileFirst Server.
- MobileFirst CLI installed on the developer workstation
Jump to:
- Installing the MobileFirst Studio plug-in
- Installing the THyM plug-in
- Creating a Cordova project
- Importing an existing Cordova project
- Adding the MobileFirst SDK to Cordova project
- MobileFirst Commands
- Tips and Tricks
Installing the MobileFirst Studio plug-in
- While in Eclipse click Help → Eclipse Marketplace…
- In the find field search “MobileFirst” then click “Go”
-
Click “Install”
- Complete the installation process
- Restart Eclipse for the installation to take affect.
Installing the THyM plug-in
Note: To run THyM you must be running Eclipse Mars or later
- While in Eclipse click Help → Eclipse Marketplace…
- In the find field search “thym” then click “Go”
-
Click “Install” for Eclipse Thym
- Complete the installation process
- Restart Eclipse for the installation to take affect.
Creating a Cordova project
In this section we will discuss how to create a new Cordova project using THyM.
- While in Eclipse click File → New → Other…
-
Narrow options by searching for “Cordova” and select Hybrid Mobile (Cordova) Application Project in the Mobile directory and click Next
-
Name the project, and click Next
- Add the desired platform for your project and click Finish
Note: If you need additional platforms after creation see Adding platforms
Importing an existing Cordova project
In this section we will discuss how to import an existing Cordova project that has already been created using the Cordova CLI.
- While in Eclipse click File → Import…
- Select Import Cordova Project in the Mobile directory and click Next >
- Click Browse… and select the root directory of the existing Cordova project.
- Ensure the project is checked in the “Projects:” sections and click Finish
If you import a project without any platforms you will see the following error, please see the adding platforms section on how to resolve this error.
Note: If you need to additional platforms after an import see adding platforms
Adding the MobileFirst SDK to Cordova project
Once you have installed THyM and the MobileFirst CLI plugin into Eclipse and have either created a Cordova project or imported a Cordova project you can then follow the below steps to install the MobileFirst SDK via Cordova plugin.
- In the Project Explorer right click the plugins directory and select Install Cordova Plug-in
-
In the Registry tab of the presented dialog box search mfp and select cordova-plugin-mfp and click Finish
MobileFirst Commands
To access Mobile Foundation shortcuts, right-click the root project directory and navigate to IBM MobileFirst Foundation.
Here you will be able to select from the following commands:
Menu option | Action | MobileFirst command-line interface equivalent |
---|---|---|
Open Server Console | When the server definition exists, opens the console so you can view the actions of the specified server. | mfpdev server console |
Preview App | Opens the app in the browser preview mode. | Opens the app in the browser preview mode. |
Register App | Registers the app with the server that is specified in your server definitions. | mfpdev app register |
Encrypt App | Runs the web resource encryption tool on your app. | mfpdev app webencrypt |
Pull App | Retrieves the existing app configuration from the server that is specified in the server definition. | mfpdev app pull |
Push App | Sends the app configuration of your current app to the server that is specified in the build definition so you can reuse it for another app. | mfpdev app push |
Updated App | Packages the contents of the www folder in a .zip file, and replaces the version on the server with the package. | mfpdev app webupdate |
Tips and Tricks
External IDE’s
If you would like to test or deploy to a device via an External IDE (Android Studio or Xcode) this can be accomplished via the the context menu.
Note: Please be sure to manually import your project into Android Studio to set up the gradle configuration before launching from Eclipse. Otherwise you might run into unnecessary steps or errors. From Android Studio select import Import project (Eclipse ADT Gradle, etc.) and navigate to your project and select the android directory within the platforms directory.
In the Eclipse project explorer right click the desired platform (i.e. android or ios in the platforms directory) → hover over Run As in the context menu → select the appropriate external IDE.
Adding platforms
Adding additional platforms is a simple process that the THyM plugin does not make intuitive. You have two options to accomplish the same task, and they are as follows.
- Via Properties
- Right click your project and select properties from the context menu.
- In the presented dialog select Hybrid Mobile Engine from the left hand menu.
- In this pane you will be able to select or download the desired platforms.
- Via Terminal
- Right click your project and hover over Show In and select Terminal from the context menu.
- This should add a tab to next to the console in Eclipse
- Here you will be able to manually add platforms using the Cordova CLI commands
cordova platform ls
will list the installed and available platformscordova platform add <platform>
where ** equals your desired platform, will add the specified platform to the project. - For more information on Cordova platform specific commands see Cordova platform command documentation.
Debug mode
Enabling debug mode will show debug level logs in the Eclipse console, while previewing the application in a browser. To enable debug mode do the following:
- Open Eclipse’s Preferences.
- Select MobileFirst Studio Plugins to show the plug-ins preferences page.
- Ensure the Enable debug mode check bocks is selected, then click Apply → OK
Live update
While previewing an application live update is available. You can make updates and save you changes and watch them auto refresh in the preview.
Integrating MobileFirst Server into Eclipse
Using the MobileFirst Developer Kit, You can couple together the above with running the MobileFirst Server in Eclipse to create a more integrated development environment.
Demo Video
Inclusive terminology note: The Mobile First Platform team is making changes to support the IBM® initiative to replace racially biased and other discriminatory language in our code and content with more inclusive language. While IBM values the use of inclusive language, terms that are outside of IBM's direct influence are sometimes required for the sake of maintaining user understanding. As other industry leaders join IBM in embracing the use of inclusive language, IBM will continue to update the documentation to reflect those changes.