Packaging a Sencha Touch App for iOS using Windows 7.

UPDATE: It seems from comments made by Ryan and Michael (see comments) that this packaging example no longer works with the latest versions of Sencha Cmd tool and SDK.  Ryna has succesffuly packaged using an old version of Sencha Cmd (ver, however,  which I have available on my drop box:

These are the steps I took, in detail, to package a Sencha Touch application for iOS using Windows 7. This means you can install the Sencha Touch app onto your iphone or ipad as a native application instead of browsing to it. The process is complex, involves several steps and took a few goes to get right. It may change as well depending on new releases of software particularly from Sencha. I’ll try to keep the instructions up to date as much as possible. But if anyone finds them to be incorrect or have found a better way then please add a comment. I have used the following posts as my own guide when packaging for the first time and this post just brings these instructions together, focusing on Sencha Touch.

Leslie Hanks post: iOS Development on Windows w/ PhoneGap Build

Emanuele Feronato’s blog post

I have also used Emanuele’s screenshots in this tutorial as they show exactly what I need. His post was the most helpful.

As with any of my posts I like to start from the presumption that you have none of the software and are starting from the very beginning. These are the steps you need to take:

1. Download and install Sencha software

2. Acquire an Apple Dev Member Login and get Device Name and UDID

3. Create a new Sencha Touch app

4. Build a production version of the Sencha Touch app

5. Download and install Open-Ssl

6. Login to Apple Developer Member Center

7. Generate a developer certificate signing request (.csr) file using Open-Ssl and upload to iOS Provisioning Portal

8. Use the cer downloaded from Apple to generate a .p12 file

9. Acquire a Development Provisioning Profile

10. Package the Sencha Touch app using Sencha Cmd Tools

11. Add the application to iTunes

1. Download and install Sencha software

To begin with, if you haven’t already done so, you need to download the latest Sencha Touch sdk, which, at the time of writing was 2.1.0. You can download it from here. The download is a zip file. Mine was named Once you have downloaded it, you can copy the contents of the zip to C:\inetpub\wwwroot\sencha or similar and browse to it at http://localhost/sencha. When browsing to the address you should see the sencha docs page as default. If the browser (chrome) throws an error such as “Failed to load resource: the server responded with a status of 404 (Not Found)”,then you need to add .json as a mime type to IIS.

The other Sencha tool to download is the Sencha Cmd tool.You can download this tool from here. At time of writing the version was The download was named Once downloaded you just need to double click on the exe and go through the installtion process. Once you have installed the tool you can open a command prompt (Start>cmd) and type in “Sencha”. You should get the following output:

Microsoft Windows [Version 6.1.7601]

Copyright (c) 2009 Microsoft Corporation. All rights reserved.


Sencha Cmd v3.0.0.250


* –debug, -d – Sets log level to higher verbosity

* –plain, -p – enables plain logging output (no highlighting)

* –quiet, -q – Sets log level to warnings and errors only

* –sdk-path, -s – sets the path to the target framework


* app – Perform various application build processes

* compile – Compile sources to produce concatenated output and metadata

* fs – A set of useful utility actions to work with files.

* generate – Generates models, controllers, etc. or an entire application

* manifest – Extract class metadata

* package – Packages a Sencha Touch application for native app stores

* theme – Builds a set of theme images from a given html page


* ant – Invoke Ant with helpful properties back to Sencha Command

* build – Builds a project from a JSB3 file.

* config – Loads a config file or sets a configuration property

* help – Displays help for commands

* js – Executes arbitrary JavaScript file(s)

* which – Displays the path to the current version of Sencha Cmd


This means that it has installed ok. As you may have figured, Sencha Cmd is a command line tool from which you can run several processes related to Sencha Products. One of which is packaging the app for iOS or other mobile platforms.

Acquire an Apple Dev Member Login and get Device Name and UDID

Acquiring an Apple Developer login is a process covered in this blog post by Emanuele Feranato. You need to sign up and pay $99 to acquire a login that will enable you to access the iOS Provisioning Portal and acquire the necessary certificate and Provisioning Profile to make the app work with an Apple device.

At this point you can also get the UDID of the iphone(s) and ipad(s) that you wish to install the Sencha Touch app onto. You need to enter these into the iOS Provisioning Portal when logged into the Apple Dev Member Centre. To get the UDID you can either connect the device whilst in iTunes and click on the serial number for the device or install an app onto the device such as UDID sender. The UDID is 40 characters long. Also note down the Device’s name (e.g. “Peter’s iPhone”).

3. Create a new Sencha Touch app

The starting point with Sencha is to create a new boilerplate code template, which can be used to generate a production build, which in turn will be packaged into an iOS native app. To create a new app, open a command prompt and cd into the root of the Sencha Touch sdk (in my case C:\inetpub\wwwroot\sencha). Then type in “sencha generate app test .\test”. The Sencha Cmd tool will generate a new Sencha Touch application called “test” in the directory C:\inetpub\wwwroot\sencha\test”. You can test that the app works by browsing to http://localhost/sencha/test.

4. Build a production version of the Sencha Touch app

Using the Sencha Cmd tool again, you can build a production version of the app. This is bascially a slimmed down version of the same app with all the debug code removed and only the required files included. This step is necessary as you don’t want to copy an unnecessarily big application onto your phone. You can get a production build by cd ing to the test application root (C:\inetpub\wwwroot\sencha\test) then typing in “sencha app build production”. This will build the application into C:\inetpub\wwwroot\sencha\test\build\production). Again you can browse to http://localhost/sencha/test/build/production to test that this has worked. You should see the same page as when you browsed to http://localhost/sencha/test but the production build is probably noticeably quicker to load.

5. Download and install Open-Ssl to generate the Developer Certificate

So now we have a Sencha Touch production built app ready for packaging. And this is where the process becomes more complex, bringing in other software to help with the task. You need to download and install Open-ssl, which will enable you to generate the .p12 Developer certificate that must be used when packaging the Sencha Touch application. To download Open-ssl you need to go here. I downloaded the Visual C++ 2008 Redistributables and Win32 OpenSSL v1.0.1c installs and installed them in this order. One other thing to do is to set the config path for openssl by entering the following command:


Once Open-ssl is installed you can test by opening a command prompt, cd ing to the bin directory of openssl (in my case C:\openssl-win32\bin and typing in “openssl”. You should get an openssl>prompt.

6. Login to Apple Developer Member Center

With Open-Ssl installed, you can generate the .p12 certificate for the Sencha Touch “test” application. To begin with you need to generate a certificate signing request that you will upload to the Provisioning Portal, so make sure you are logged in to the Apple Developer Center. Once logged in you need to click on the iOS Provisioning Portal section.

You then need to click on the certificates link in the left hand navigation.


7. Generate a developer certificate signing request (.csr) file using Open-Ssl and upload to iOS Provisioning Portal

So you have an Open-Ssl prompt and you also are logged in to Apple Dev Center and are on the Certificates page of the iOS Provisioning Portal. You now need to generate a .certSigningRequest file to upload which will cause the Apple site to generate a .cer file which you then download and convert into a .p12 file. To generate the .csr file at the openssl> prompt type:

openssl>genrsa -out private.key 2048

This is to generate the private key to use to sign the certificateSigningRequest file.

You should get output similar to

Generate Private Key

Loading ‘screen’ into random state – done

Generating RSA private key, 2048 bit long modulus



e is 65537 (0x10001)

next you need to enter the command to generate the .certSigningRequest file, which is:

openssl>req -new -key private.key -out CertificateSigningRequest.certSigningRequest -subj “/, CN=Alex Graham, C=UK

The output should be

Loading ‘screen’ into random state – done

Note that the emailAddress, CN (your name) and C (country) parameters are required but I don’t think you have to put anything in here that ties into your details entered when creating your Apple login. Its just info that’s used by Apple to create the .cer. So what I’m saying is this info can be anything you want it to be.

Look in the bin folder of open-ssl (C:\openssl-win32\bin) and you should now see a CertificateSigningRequest.certSigningRequest file.

Go back to your logged in Apple screen currently at the certificates page. You should see something similar to this:


…A screen with no certificates listed. Click on the Request Certificate button. You should now see a screen asking you to upload a file:


Browse to the CertificateSigningRequest.certSigningRequest file and upload this file. The page after the file uploads should now look like:


with the request “Pending”, refresh the browser and the page should change to this:


Where you can download the certificate from Apple, which is a file called “ios_development.cer”. Download the file and move it to the C:\openssl-win32\bin folder.

8. Use the cer downloaded from Apple to generate a .p12 file

You now just have to enter two more commands into Openssl to generate the.p12 file. First of all, a command to convert the .cer file into a .pem file:

openssl>x509 -in ios_development.cer -inform DER -out ios_development.pem -outform PEM

Then finally the command to generate the .p12 file:

openssl>pkcs12 -export -inkey private.key -in ios_development.pem -out ios_development.p12

At this point you will be asked to enter and re-enter a password for the .p12 file. Enter a pasword and note it down as this will be used in the packaging process. For this example I will use the password “elbow”.

You now have the ios_development.p12 file in the bin folder. Create a folder called “cert”  in your Sencha test app ( C:\inetpub\wwwroot\sencha\test\cert).  Move the .p12  file to this new “cert” folder.

9. Acquire a Development Provisioning Profile

Once you have the .p12 certificate, you can create the Provisioning Profile on the Apple Provisioning Portal. Before you can do this you need to go through a few other steps on the Portal.

The first one is the development certificate, which has been created in the steps taken above.

The next step is to register the devices that you want to put the application on to test with. So on the left hand navigation, click on Devices. You should see  a screen similar to below


You then add a device


Enter the devices name and UDID as it appeared in iTunes


And that’s it, your device is registered.

Repeat the steps above for each device you wish to add.

The last step before creating the Provisioning Profile is to create the AppID for the Sencha Touch application.

To create the AppID, click on App IDs in the left hand navigation of the portal.

You should see the following page


Click on the New App ID button, and enter the required details. these comprise of:

Description: this can be anything but try and make it meaningful such as “SenchaTest”

Bundle Seed ID: This is generated by Apple. Note this for your packaging process.

Bundle Identifier: This is recommended to use a reverse domain style so enter something like “com.exampledomain.senchaTest”


Once the details have been entered, click on Submit and you should see that the AppID has been registered in the following screen:


With the AppID, and Devices registered you can now generate the Provisioning Profile. Click on “Provisioning” on the left hand navigation. You should see this screen:


Click on New Profile and enter the required info.

Name: Again, can be anything but for consistency make it “SenchaTestProfile”

Certificates: The certificate created earlier should be selected as default

AppID: The AppID just created should be selected as default.

Devices: The Devices entered earlier should be ticked as default.

If all is ok, click on Submit. The screen should change to say the profile is pending


Refresh the browser and the Profile should be ready to download


Download the file and add it to the root of your Sencha Test (production build) app at C:\inetpub\wwwroot\sencha\test\build\production. Rename the file to embedded.mobileprovision

10. Package the Sencha Touch app using Sencha Cmd Tools

We are almost there. To package the app for iOS, you now need to run the package command using Sencha Cmd tools but before you do,  you need to edit the packager.json file, which Sencha Cmd will use to do the packaging. This should have been created in the test app root folder (C:\inetpub\wwwroot\sencha\test). Browse to this folder and open the file in a text editor. You need to edit it so it contains references to the.p12 file and Provisioning profile that you created, as well as other info. An example of the packager.json file is as follows

<br /><br />{<br /><br /><%%KEEPWHITESPACE%%>	"applicationName":"SenchaTest",<br /><br /><%%KEEPWHITESPACE%%>	"applicationId":"com.xxxx.SenchaTest",<br /><br /><%%KEEPWHITESPACE%%>	"bundleSeedId":"xxxxxxxx",<br /><br /><%%KEEPWHITESPACE%%>	"versionString":"1.0",<br /><br /><%%KEEPWHITESPACE%%>	"versionCode":"1",<br /><br /><%%KEEPWHITESPACE%%>	"icon": {<br /><br /><%%KEEPWHITESPACE%%>		"57":"resources/icons/Icon.png",<br /><br /><%%KEEPWHITESPACE%%>		"72":"resources/icons/Icon~ipad.png",<br /><br /><%%KEEPWHITESPACE%%>		"114":"resources/icons/Icon@2x.png",<br /><br /><%%KEEPWHITESPACE%%>		"144":"resources/icons/Icon~ipad@2x.png"<br /><br /><%%KEEPWHITESPACE%%>	},<br /><br /><%%KEEPWHITESPACE%%>	"inputPath":"./build/production",<br /><br /><%%KEEPWHITESPACE%%>	"outputPath":"../packagedTest",<br /><br /><%%KEEPWHITESPACE%%>	"configuration":"Debug",<br /><br /><%%KEEPWHITESPACE%%>	"platform":"iOS",<br /><br /><%%KEEPWHITESPACE%%>	"deviceType":"iPhone",<br /><br /><%%KEEPWHITESPACE%%>	"certificatePath":"./cert/ios_development.p12",<br /><br /><%%KEEPWHITESPACE%%>	"certificatePassword": "elbow",<br /><br /><%%KEEPWHITESPACE%%>	"provisionProfile":"./build/production/embedded.mobileprovision",<br /><br /><%%KEEPWHITESPACE%%>	"orientations": [<br /><br /><%%KEEPWHITESPACE%%>		"portrait",<br /><br /><%%KEEPWHITESPACE%%>		"landscapeLeft",<br /><br /><%%KEEPWHITESPACE%%>		"landscapeRight",<br /><br /><%%KEEPWHITESPACE%%>		"portraitUpsideDown"<br /><br /><%%KEEPWHITESPACE%%>	]<br /><br />}<br /><br />

If you followed this example exactly as described then you only have to change the following

applicationName: Set this to what you called the app in the AppID Description

applicationId: This should be what you entered as the reverse domain for the Bundle Identifier in the AppID

bundleSeedId: Enter the 10 digit string that was generated in the App ID by Apple, e.g. YUUIO898PO

certificatePassword: This is the password you entered when generating the .p12 file. in this example it was “elbow”.

Now the packager.json file is ready you can now package the app. Open a command prompt and cd to the Sencha test folder :

>cd C:\inetpub\wwwroot\sencha\test

Then enter the sencha package command:

>sencha package build packager.json

If you get no output at all and a prompt appears after a few seconds this means that the app packaged succesfully. You should find it in the following location; C:\inetpub\wwwroot\sencha\packagedTest. The folder name should be

Worth adding here is that I asked about the no output from package build command on the Sencha Forums. Svenna responded by suggesting I use >sencha app build native command instead. I have not tried this but will do and will edit this blog if it works for me.

11. Add the application to iTunes

Plug the device that you registered  into your computer and open iTunes. For this example I presume you have plugged in your iphone.  Whilst in iTunes click on “File” in the menu and select “Add Folder to library”. Browse to the folder and select it. Now select the phone whilst in iTunes so you see the phone details in the main screen. Select the Apps tab for the phone. You should see the SenchaTest app listed on the list of apps on the left hand side and a view of the Phone’s screens on the right  hand side. Tick the SenchaTest app and click on sync. You will see iTunes syncing the application to the phone and in a few seconds you should see the app on your iphone.

Congratulations! Now have a cup of tea to celebrate 😉

Hope this post helps anyone doing the same thing on their windows 7 machine. If you have anything to add or any helpful comments then please add them in the comments section



28 thoughts on “Packaging a Sencha Touch App for iOS using Windows 7.

  1. good stuff ! and very satisfying when it works – how have you gone about actually getting the app on the appstore ? I’m currently stuck at this point – caught between running a virtual mac and buying a second hand macbook. The former seems the longest way around, and the latter ver pricey.

    I tried borrowing a pal’s macbook for an evening, but couldn’t find anywhere to upload my .ipa file – probably because the whole packaging process happens through xcode. Gave it back the next day none the wiser !

    hair almost all pulled out now – appreciate any help sir !

    (btw am using flash & adobeair rather than sencha )

    • Hi Jerry

      Thanks for commenting. I’ve not done the syndication on app store yet, sorry. I think I need a stiff drink before I do that ;).

      Have you looked at Emanuele Feranato’s post ? He explains how to package a flash app.

      I’m sure you don’t need a mac for submitting the app to apple but if you do I was considering




      • Thanks for the response – that maccloud system looks like a keeper. Yup I’ve read Emanuele’s posts on the matter – he’s a smart guy. Between his and ibrent’s tutorials I’m ready to upload my distribution cert signed .ipa – it’s this next step that has me shitting in my shorts. Mac and me have never seen eye-to-eye since I found out you have to drag the floppy disc icon into the recycle bin to eject it !
        This post has a lot of people enjoying similar conundrum’s – I’m just suprised how old all the posts are. So many approaches, but none of ’em seem to be The Best One.

      • no problem. Yeah, looks like you are ahead of me. I’ve not looked into actually putting something onto the app store yet.Looks like you need to find that one elusive post that will explain it all. I’m reluctant to get a Mac as well as getting a 1K+ laptop purely to put something onto an app store seems silly. Love gametoilet btw 😉

      • Jerry, just looked at the tutorial on adobe and see what you mean. I don’t know anything about dev work on Flash but can’t you just package into a folder and add the folder to iTunes without touching an Apple Mac? I can’t see why you need a Mac to get it onto iTunes. With Sencha it just generates a folder containing the app and the required certs, etc. Could you not do the same with Sencha maybe, then embed the flash game within a html file and drag this onto iTunes?? I guess Apple not liking Flash maybe a drawback?

      • Hey Alex – yup the iTunes bit is just for the uploading of the game icons/settings/description/pricing stuff – the actual uploading has to happen through the mac-only application loader. This is the bit I’m going to test out tonight at home !

        The packaging of the game I’m currently doing via a .bat file which builds the .ipa (which I’d rename to a zip on the mac) from the original swf + cert+ mob Provision file . If I get this working tonight I am going to fed-ex you a pint of beer !

      • ** WOOOOARRRGHHHHHH ** wow. WHAT a lot a fecking about – but that’s finally accepted off for review after an hour of failed attempts jumping between the macincloud window and my pc set-up. Good luck with yours Alex, hit me up if you hit any brick walls on your submit . Going to open up the quality street now and watch whatever’s on telly 😀

      • Haha that’s good to hear! Hope it gets accepted. Send me a link to it once it’s up on the app store. Yeah I’m still a way off distributing but thanks for the offer. May well take you up on that. If a mac has to be involved – and by the looks of it it does- this goes against sencha’s implied suggestion that you don’t need a mac at all.

  2. Hi,

    First of all, thank you for this AMAZING tutorial. I managed to pack it, but when I try to install it on my iphone, it says Itunes sync: failed to install. Any idea on how I can fix this?

    • Hi Daniel. Glad it helped. I got the same error as you initially. I posted about it…My solution was to make sure the .provision file was in the root of the app…And Ive noticed that my example of the packager.json file doesn’t reflect this, sorry. It says “provisionProfile”:”./build/production/embedded.mobileprovision”. It should be “provisionProfile”:”embedded.mobileprovision”. Try that and see if it works?Please post back if it does(!) I’m sure I’ve got the code I packaged around somewhere. Ive not got access to it at the moment…but if you are still stuck, then maybe send your code to me and I can compare to mine. My Email address is on my About page.

      • Dear Alex,

        Thanks for the great article. However, I followed your instructions above but still received the “Itunes sync: failed to install” error. I tried moving the embedded.mobileprovision to the application root but still get the same error. Any ideas on what else it could be? Thanks a million!


      • Hi Michael. Sorry to hear it didn’t quite work(!) Daniel Toma has the same issue (see previous comments), which makes me wonder if packaging has changed for Sencha Touch since I last did it…Off the top of my head I’m not sure what it could be. Maybe send the code to me and I can compare to mine?

  3. Good Day ,

    I tried what you did and i got same problem as Michael. “Application failed to install” on Itunes and “does not have a valid signature” in iphone configuration utility.

    I used Xcode: iOS Wildcard AppID (*) as our App ID so we can use create different apps using single provisioning profile for development.

    Below is my packager.json file





    “icon”: {






    “certificateAlias”:”iPhone Developer: My Name (xxxx)”,

    “orientations”: [

    I am using latest SenchaCmd- and Sencha Touch 2.2.1 SDK.

    I also tried to upload the generated application on build.phonegap and it works like a charm but the Sencha device api like camera function is not working.

    Thanks in advance.

    • Thanks Ryan. I’ve just not got round to trying the packaging out with new versions of Cmd and SDK, but I presume something isn’t working right if both you and Micheal experienced the same issue. I will out a comment at the top of this post to warn anyone reading it of the current problems.

      • Thanks i will try to download lower version of Sencha CMD and SDK and try it again. Hopefully we can make this thing working using the latest version of Sencha without using Mac.

      • Good Day lalexgraham, can you send me sencha cmd that you are using? I cant find any older version on Sencha CMD on Sencha Site. Have you already tried the latest version of Sencha CMD? Thanks and Regars.

  4. Thanks lalex.By the way have been successfully created ipa file using this version of Sencha CMD : SenchaCmd-…well done! 🙂 Now, I got some issues when i’m doing CRUD WCF Rest on my app where all Ext.Device functions are not working like camera capture and notification, have you also experience this?what have you done? You can check my post at .

    Thanks in advance.

    • Hi Ryan, glad the cmd version packaged it ok for you. Sorry, I’m not sure why your Ext.Device functions are not working(?) Ext.Device is not something Ive tested on a packaged app. Hopefully someone will answer you on the forum. Have you tried several wireless networks, or just the one?

  5. Thank you Alex, your guide is very useful!
    I followed it step by step, I managed to create the native app for iOS and install it on my iPhone but… as soon as I open it, the app always crashes (even if it’s a simple “hello world” app). Does anybody have the same problem? Can anyone help me please?
    I use Windows 8 and iOS7 (but it was the same with iOS6).
    Same problem with Sencha Touch 2.2.1 and Sencha Command (I couldn’t event manage to install it on iPhone) and the newest Sencha Touch 2.3.0 and Sencha Cmd 4.
    Thank you

    • Hi Ilaria, glad it helped. When you say crash, does the app run then exit or stay on screen? Does it have any error message? Does it run ok in the browser either on your device or on your PC? I know that sencha cmd 4 is using Cordova and phone gap to create native apps so I need to rewrite this anyway. How did you find using sencha cmd4?

      • thank you for your reply. Everything works fine on my Pc and in mobile browser too (without packaging). the problem occurs only with the native app. It opens for a sec and then it always exits. No error message. I also had issues with a former version of Sencha Cmd (but I wasn’t even able to install it, with an error message). Everything works fine with a Mac, obviously! =)
        As long as I understood, with sencha Cmd 4 you can use Cordova and Phone Gap, but it’s your choice and you have to setup the app for using them.

      • Finally I’ve found a trick. I package the app as native (sencha app build native). Then I create a .zip file of the folder named ‘webapp’ in build/native-package-mobile/myapp/packager.json/ I upload the zip file on phonegap and package it again in phonegap website. I download and install the .ipa file on my device and… it works! That’s not the best solution but at least it works. Thank you for your help

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s