Since browsers don’t know about TypeScript we need to convert our TypeScript code into something they do understand.
The process of converting TypeScript into ES5 is called transpilation and we use a tool called
tsc to compile on the command line.
It’s useful to have the
tsc tool so you can try out TypeScript yourself and transpile on the command line but it’s not necessary to do this in your everyday Angular development.
Projects built using the Angular command line tools use the webpack bundler which handles transpilation of your TypeScript for you. When coding Angular via plunker SystemJS transpiles TypeScript for you in the browser.
It is good however to have
tsc installed especially if you want quickly try our some TypeScript features and see how they are transpiled into ES5 or ES6.
We can install typescript via
npm install -g typescript
The preceding command will install the TypeScript compiler and add its executable
tsc to your path.
To make sure everything worked correctly type:
And it should print something like
Create a file called
Inside that file add
This generates a file called
And we can execute that file by using node, like so:
We can watch a typescript file for changes and compile it automatically with:
tsc -w hello.ts
We can provide configuration on the command line, like so:
tsc -t ES6 -w hello.ts
-t ES6is a flag to tell typescript to transpile into ES6 instead of the default ES5.
However if we are want to watch a whole directory we need to use a configuration file.
We can create a config file with the most common settings like so:
If we want to watch all files in a directory we can just type: