Monday, October 19, 2015

Using taco to create Ionic projects for the Windows platform

Recently Microsoft released Tools for Apache Cordova Command Line Interface (TACO CLI), by using TACO, you can quickly start building awesome Apache Cordova apps really and leave all the plumbing of the different platforms dependencies, plugins, etc. to the tools to take care of. For example the following few commands create a cordova project based on the ionic base template, add the android platform to the project, install the platform requirements, build the app, and run it in the emulator:

$ taco create sampleApp --template https://github.com/driftyco/ionic-app-base

$ cd sampleApp

$ taco platform add android

$ taco install-reqs android

$ taco build android

$ taco emulate android

Check the TACO home page of for installation instructions and more information http://taco.tools/.

I ran into a problem when i created a new project based on the ionic base template and tried to run it on a windows 8.1 emulator, to reproduce the issue use the following taco commands to create a new project

$ taco create myIonicApp --template https://github.com/driftyco/ionic-app-base

$ cd myIonicApp

$ taco platform add windows

I will use Visual Studio 2015 Enterprise to continue working on my project, to do that, from VS go to File -> New -> Project From Existing Code...

 0

On the wizard select "Apache Cordova" and click Next

1

Specify the path of the project created earlier and enter the name of the project and click finish

2

Now select the "Windows Phone (Universal) platform and select any emulator from the available ones and try to run the project

3

You will receive the following exception

Unhandled exception at line 12227, column 9 in ms-appx://io.taco.hellotaco/www/lib/ionic/js/ionic.bundle.js
0x800c001c - JavaScript runtime error: Unable to add dynamic content. A script attempted to inject dynamic content,
or elements previously modified dynamically, that might be unsafe. For example, using the innerHTML property to add script
or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content,
or explicitly create elements and attributes with a method such as createElement. 
For more information, see
http://go.microsoft.com/fwlink/?LinkID=247104.

4

After searching for awhile, i found the problem and the solution documented here

https://github.com/MSOpenTech/winstore-jscompat?cm_mc_uid=33727106062614450717560&cm_mc_sid_50200000=1445071756

So all we need to do is to reference the JavaScript file winstore-jscompat.js  in our application before any other script

5

Now try and run your application, every thing will work just fine.

Sunday, August 16, 2015

bower.config in VS 2015 (RTM): packages versions are not loading correctly

While working the VS 2015 RTM, I found that IntelliSense in bower.config file cannot load the versions of the packages.


the problem is reported here, and the solution that worked for me is to install the git tools and run the command

git config --global url."http://".insteadOf "git://"

then restarting VS. this will hopefully solve the problem.