Targeting Windows Universal with PhoneGap

I recently inherited a code base that had been maintained using the Apache Cordova tools for Visual Studio. The project had initially been created using the PhoneGap command line tool, but the developers soon realized that PhoneGap did not yet have support for Windows Universal apps and switched to using the Visual Studio tooling for Cordova.

When i took over the code base my first take was porting the application to Android. While porting the application i was constantly testing the app on both platforms to make sure that i had not broken anything. Having to fire up Visual Studio to build the Windows solution everytime made me sad. Infact, it made me so sad that the rest of this article is dedicated to documenting what i did to get around it.

Compile

Lets start by creating a new project and adding the Windows platform:

  • phonegap create HelloWorld
  • cd HelloWorld
  • phonegap platform add windows

We can now easily build the project by running phonegap build windows however, you will notice that by default Cordova only outputs a package for Windows 8.1 and Windows Phone 8.1.

To make the Cordova output a Windows 10 package we need to add a preference to our config.xml file.

<preference name="windows-target-version" value="10.0" />

Once the above is added we can clean out the AppPackages folder and run phonegap build windows. PhoneGap will now only output a single Windows10 version of the app.

Everything looks good at this point, or so i thought. It turns out that running phonegap build windows --release results in an error.

MSB3779: The processor architecture of the project being built "Any CPU" is not supported by the referenced SDK "Microsoft.NET.Native.Runtime.1.1, Version=1.1". Please consider changing the targeted processor architecture of your project (in Visual Studio this can be done through the Configuration Manager) to one of the architectures supported by the SDK: "x86, x64, ARM".

So it turns out that .Net Native does not like the Any CPU compilation profile, which happens to be the default for our project. To get around this we can specify a set of target architectures for our project when building it.

phonegap build windows --archs="x86 x64 arm" --release"

If you navigate back into the AppPackages folder you will notice we now have a Windows Universal app for each architecture.

Sign

The process for signing your app varies depending on weather you are submitting an update or a completely new app.

Instructions on how to sign a new app without Visual Studio can be found over here so i wont go into detail on the subject. However, using an existing certificate is not documented anywhere, so lets talk about that for a bit.

Existing Certificate

In my case because the app was already in the store we had to use the certificate that had already been generated. I had to do a few things to get this to work and so will you.

  • Update the author in your config.xml to match the certificate that you plan on using to sign the app
  • Update the name in your config.xml to match the name you reserved in the Windows Store.

You will also need to update the Window Store Identity name which can be done by adding another preference to your config.xml file.

<preference name="WindowsStoreIdentityName"value="DeveloperHut.UWPTest"/>

Finaly, we can add a build.json file and specify what certificate should be used to sign the app. To do this create a file called build.json in the root of your project and add the following to it.

{ "windows": { "release": { "packageCertificateKeyFile": "cert.pfx" } } }

The above assumes your certificate is called cert.pfx and is located in the root of your project as well. To see if it all works we can go and compile our project this time passing in our build.json file.

phonegap build windows --archs="x86 x64 arm" --release --buildConfig build.json

Thats pretty much all there is to it. You should be able to go ahead and submit an update.

Summary

I now have a PhoneGap project that is outputting Windows Universal binaries and can be built from the command line, which is what we set out to achieve.


comments powered by Disqus