Phone and Tablet Apps with PhoneGap


Key Points


Creating native applications for phones and tablets is easy by combining Durandal with PhoneGap/Cordova. The first step is to optimize your application for deploy. How you do this depends on what platform and setup you are running. In general, you have these options:

Ultimately, the output of this process should be a file such as main-built.js which contains all your app's JavaScript and HTML. Next, you will want to locate the www folder inside of your PhoneGap/Cordova project (or the corresponding location depending on the target platform). Copy all your applications's assets to that folder. This includes, images, css, 3rd party JS libraries...and of course, your main-built.js file. Finally, you need to update the index.html file so that it points to your css, etc and be sure to add a script reference for main-built.js. That's it.

Note: If you wish to run without needing to optimize, you may need to perform an additional step. For example, the PhoneGap Visual Studio 2012 template requires that you alter Plugins/File.cs by changing readResourceAsText, because it reads the views from the wrong location. You can see this article for more information.

Note: If you are pulling in JSON files locally using http.get you should switch to using $.getJSON instead to avoid some issues with the way PhoneGap serves local files without Content-Types.