Sunday, 29 November 2015

Ionic2 with Typescript and Visual Studio support


Intro

I love development its not my job its part of my life :) So i am always opened to new technologies languages, except python (Actually i tried it but i dont like syntax of it so). So since I am working with Angular I am following version 2 to get some news and understand what would be in the future.
This blog post will not be an expert post I would say is more for dummies people like me who use to use Visual Studio but want to play with TypeScript.
When firstly i saw TypeScript  I ask question my self why? why to have compiler when you write code and then its compiled to Javascript, I can easily write just vanilla js and I dont want to learn this language, but new languages are not created to make complexity, so i was again reading a bit more about typescript and finally i understood benfits of it

  • You can compile and catch exception. This is really awesome for people like me who really use to compile and found basic exceptions
  • ES and browsers, EcmaScript is changing dynamically adding new features, but generally browsers are not so fast to implement that, here TS solve this issue because when you compile sources you choose target ES version to compile.
  • Much easier to start for people who know C#, Java and other similar languages.
Since again i like to work with new stuff i am fun of Ionic framework and i started playing with new Alpha version. I will not write how to setup all of that i will just write how to run project in Visual Studio.

Let go

First step would be to create project
Next depends if ionic project was already created then copy files to new folder, if not then run ionic create commands from project folder.
Go to Visual Studio and include files to Project

As you can see in my project there is typings folder. This is magic folder since it contains all definitions for classes and this helps intellisence

To manage typing install tsd manager
npm install -g tsd
now we can install all typing definitions
tsd install angular2/angular2
For ionic2 there is not yet official defenitions yet but there is opened issue on github but jksoftpro posted his typing which works pretty cool. But i did download file and placed to typing folder.
Please note to make it work all typedefinitions must be included in project. So if something is not working make sure that you have included .d.ts
 And now everything work visual studio now suggests methods

Volodymyr Bilyachat Web Developer