Quantcast
Channel: Intel Developer Zone Articles
Viewing all articles
Browse latest Browse all 3384

Export your Intel® XDK Mobile App to PhoneGap* Build or Cordova* CLI

$
0
0

A version of this article was originally published as part of the Intel® XDK documentation book.

When your Intel® XDK project was built by the Intel XDK cloud-based build system, it was converted to an Apache* Cordova* CLI project and then built as a standard Cordova CLI application in that cloud-based build system. With the retirement of the Intel XDK cloud-based build system, a Cordova Build Package tile was added to the Build tab so you can use Adobe* PhoneGap* Build or Cordova CLI to build your Intel XDK mobile app.

To build your Intel XDK project using PhoneGap Build or Cordova CLI you need a Cordova config.xml file. The Cordova Build Package ZIP file generated by the Intel XDK contains a config.xml file and can be submitted directly to PhoneGap Build, or quickly turned into a local Cordova CLI project. See the respective articles, titled Build Your Intel® XDK Mobile App using PhoneGap* Build and Build Your Intel® XDK Mobile App using Cordova* CLI, for details regarding building with these tools.

Two methods are described below on how to create a config.xml file. The first utilizes the built-in Cordova Build Package tile on the Build tab and the second uses an external Node.js* script named xdk-to-cli.

If you want the simplest build experience, or are not sure, you should Build using PhoneGap Build. This build process does not require installation of any software on your development system and performs the build in the cloud, like the retired Intel XDK build system. It has plugin limitations similar to the Intel XDK build system, specifically, plugins that utilize custom gradle scripts are not supported. This is the best place to start, if it does not serve your needs you can easily change to Cordova CLI.

For maximum control and flexibility over your build process you should Build using Cordova CLI. You will have access to the widest range of Cordova plugins. You must install Node.js, Cordova CLI and the requisite backend build tools (Android Studio, Xcode and Visual Studio) to perform your Cordova builds on your local development machine. Building for iOS requires access to a Mac (and Xcode) and building for Windows requires access to a Microsoft Windows machine (and Visual Studio).

Using the “Cordova Build Package” Export Tool

The process described below generates a ZIP file that contains a copy of your project’s source and asset files and an auto-generated config.xml file. That config.xml file contains the instructions needed by Adobe PhoneGap Build or Cordova CLI to build your mobile app package.

In the text below, PGB is shorthand for PhoneGap Build and CLI is shorthand for Cordova CLI.

The basic process is:

  • Projects tab: select the Intel XDK project to be built with PGB or CLI.
  • Projects tab: insure that all project Build Settings are correctly specified.
  • Build tab: click the Create Package button on the Cordova Build Package tile.
  • Build tab: save the ZIP file that is created to your local hard drive.
  • PGB: submit the ZIP file to PhoneGap Build using your PGB account.
  • CLI: extract the ZIP file and use Cordova CLI to build your app.

Create the Cordova Project ZIP File

Use the Cordova Build Package export tool on the Build tab to create the Cordova project ZIP file that you will submit to PhoneGap Build or use to build locally with Cordova CLI. The project settings in the Build Settings section of the Projects tab must be correctly set to create the project ZIP file.

NOTE: The "Developer Certificate" and "Provisioning File" fields in the Android and iOS Build Settings sections of the Projects tab are ignored and not required for this process. You can safely ignore any warnings generated by these fields.

A green checkmark icon next to a build target means you can successfully export your project Build Settings (see the middle target in the image below). An orange <!> icon next to a build target means some warnings will be generated during the export, but the export will succeed (see the top target in the image). A red <!> icon next to a specific build target lets you know that there are some Build Settings that require your attention (see the bottom target):

Hover over the red <!> icon for a link that will take you to the Build Settings on the Project tab. Once on the Project tab you may have to expand the Build Settings and select the specific build target tab in the Build Settings section to make the necessary corrections:

Packages exported for use with PhoneGap Build and Cordova CLI will ignore the “certificate fields” in the Build Settings section of the Projects tab. Your build certificates must be added manually to your PhoneGap Build account or your Cordova CLI project. Adding build certificates to your PhoneGap Build account or your Cordova CLI project is an operation that you must perform, the Intel XDK cannot do this for you.

You can disable a build target if you want to limit the build instructions in the config.xml file to specific targets (e.g., only Android* and iOS*). For example, if you have never built for Windows* you likely do not have any meaningful Build Settings configured for that build target, so you can simply “disable” that build target:

Finally, use the Create Package button to create a ZIP file that includes your app sources and a config.xml file for building with either PhoneGap Build or Cordova CLI:

Cordova Build Package ZIP File Contents

The contents of the ZIP file that is generated by the Cordova Build Package export tool are your source and assets folders along with a config.xml file formatted for use with PhoneGap Build or Cordova CLI:

The www folder contains your application source files and is an identical copy of the www folder in your Intel XDK project folder. Likewise, the package-assets folder is an identical copy of the same-named folder in your Intel XDK project folder; it contains your app icons and splash screen images.

The config.xml file is a merge of your project’s Build Settings from the Projects tab and the intelxdk.config.additions.xml file (if any) located in the root of your Intel XDK project folder (similar to the various intelxdk.config.<target-platform>.xml files that are auto-generated).

Other folders and files may be present in the ZIP file, but they will be ignored by PhoneGap Build and Cordova CLI. Usually, any extra files and folders are just informational elements that were part of a sample or template project that was used to create your project.

If you are familiar with Cordova CLI projects, you will notice there are no plugins, platforms or hooks folders in the root of the exported project. This is by design; those folders are ignored by PhoneGap Build and will be auto-generated by Cordova CLI.

After you have successfully exported a Cordova Build Package you can build your app using either PhoneGap Build or Cordova CLI (or compatible build systems). See the articles titled Build Your Intel® XDK Mobile App using PhoneGap* Build and Build Your Intel® XDK Mobile App using Cordova* CLI for details.

Using the ‘xdk-to-cli’ Node.js Script

If you are unable to successfully create a ZIP file using the Cordova Build Package tile, or if you want more control over that process, you may need to use this xdk-to-cli Node.js script. Full instructions and requirements are provided in the script’s README file.

Using xdk-to-cli with PhoneGap Build

This script does not create a ZIP file, it creates three target- specific build configuration files. Those config files are written to the root folder of your Intel XDK project.

To create a ZIP file for submission to PhoneGap Build:

  • Create a config.xml file (see the script’s README) and save it to the root of your Intel XDK project folder.
  • ZIP the contents of the entire Intel XDK project folder and submit it to PhoneGap Build (PhoneGap Build will ignore the plugins folder in the ZIP file).

If the resulting ZIP file is too large for submission to PhoneGap Build, you can exclude the plugins folder (and any other extraneous folders and files) from the ZIP, to save space. The plugins folder is ignored because PhoneGap Build uses the <plugin> tags in your config.xml file to retrieve the plugins required by your application.

 Using xdk-to-cli with Cordova CLI

If you are going to use Cordova CLI to build your project, you will need to make a copy of the Intel XDK project folder (excluding the plugins folder) and then execute the necessary Cordova CLI commands to create a buildable Cordova CLI project. In general, it is not a good idea to use the existing plugins folder that is already present in the Intel XDK project because the Intel XDK internal pluginadd mechanism that creates that plugins folder short circuits the normal Cordova pluginadd operations, in order to provide support for all build platforms, regardless of your development OS. This short circuit mechanism that is used by the Intel XDK can interfere with a local Cordova CLI build.

For more details on how to continue to use the Intel XDK alongside a Cordova CLI build system, see the section named Integrating Cordova CLI with the Intel XDK in the article titled Build Your Intel® XDK Mobile App using Cordova* CLI.


Viewing all articles
Browse latest Browse all 3384

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>