Have you heard about the TypeScript?
- TypeScript is an Open Source language developed by Microsoft (under the Apache 2.0 license).
- TypeScript file extension is .ts (usually) and TypeScript compiler will generate output as a .js file.
- TypeScript is syntactically very similar to JScript .NET.
- TypeScript is very easy to learn and understand.
- Type annotations
- Compile time type checking
- Arrow functions (Similar to Lambda Expression in C#)
Currently TypeScript Template/Syntax highlighting is supported in Visual Studio 2012 by installing TypeScript plug in and also Syntax highlighting to the TypeScript (.ts) files are supported in text editors like Sublime Text, Vim and Emacs
In VS 2012 Editor If we open TypeScript file there we have options like Refactor, Go To Definition etc .
How to get it
You can install TypeScript in two ways,
Note : Close all other applications to avoid installation problems.
If you are installing through the msi then you will get the below screen.
If you wanted to see TypeScript in action without installation then click here.
How to compile TypeScript
The TypeScript compiler will be installed in the below location by default.
C:\Program Files (x86)\Microsoft SDKs\TypeScript\0.8.0.0
C:\Program Files\Microsoft SDKs\TypeScript\0.8.0.0
To compile the TypeScript file we need to use the below command in command prompt,
Once its compiled successfully then there will be a .js file generated with the same filename in same location. you can change this settings by passing the command line arguments.
If you want to automate the TypeScript compiling process then you might be interested in Sholo.TypeScript.Build , Web Essentials 2012.
TypeScript Project/File Templates
Once you have installed plug-in for Visual Studio 2012, you will get the below templates,
HTML Application with TypeScript
MVC – TypeScript Internet Application
My first HTML Application with TypeScript.
Now I'm going to create a simple HTML Application with TypeScript
To create a new html application with typescript, go to File->New-Project
Once you click on the 'OK' button then then solution file will be created with the default template files like below,
We can see that the app.js is depend on app.ts. The default app.ts file contains class and constructor etc see the code below,
This auto compilation is happened because of the below entry in
Wen you run this application the output prints the current date and time.
You can play with TypeScript online on Playground
In this article I have given an introduction to TypeScript. I hope you have enjoyed this article and got some value addition to your knowledge.
I have put my time and efforts on all of my articles, please don't forget to mark your votes, suggestions and feedback to improve the quality of this and upcoming articles.