How to setup the Environment
for TypeScript.
Prerequisite:
Npm.
Editors:
·
Visual
Studio 2013 or New Version.
Visual Studio Code extension (https://code.visualstudio.com/blogs)
etc.
Steps:
·
Create
a Project folder.
e.g. D:\Shrikant\typescript
demo
·
Go to
Project folder in Command Prompt or Node.js Prompt.
C:\Windows\System32>D:
C:\Windows\System32>cd
D:\Shrikant\typescript demo
·
Create
Project Meta data file Or Root file (Package.json) using below command
“npm init ”.
This will ask for project details such name, version and author etc.
Fill the details or press enter.
e.g. D:\Shrikant\typescript demo>npm
init
Result: This utility will walk you through creating a package.json
file.
It only
covers the most common items, and tries to guess sensible defaults.
See `npm help
json` for definitive documentation on these fields
and exactly what
they do.
Use `npm
install <pkg> --save` afterwards to install a package and
save it as a
dependency in the package.json file.Press ^C at any time to quit.
name:
(typescript demo) ShrikamtM
Sorry, name
can no longer contain capital letters.
name: (typescript
demo) shrikantm
version:
(1.0.0)
Invalid
version: " "
version:
(1.0.0) 1
Invalid
version: "1"
version:
(1.0.0) 1
Invalid
version: "1"
version:
(1.0.0)
description:
entry point:
(index.js)
test command:
git
repository:
keywords:
author:
license: (ISC)
About to
write to D:\Shrikant\typescript demo\package.json:
{
"name": "shrikantm",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"typescript": "^2.0.10"
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" &&
exit 1"
},
"author": "",
"license": "ISC"
}
Is this ok?
(yes)
·
Enter
“y” to confirm creation of Package.json
file.
·
Add
typescript reference to project using below command.
D:\Shrikant\typescript demo>npm install
--save-dev typescript
·
Go to
.bin folder.
D:\Shrikant\typescript
demo>Cd node_modules\.bin
·
Create
typescript config file (tsconfig.json)
using below code.
D:\Shrikant\typescript
demo\node_modules\.bin>tsc –init
Result: message TS6071: Successfully created a tsconfig.json file.
·
Move tsconfig.json manually to root folder where package.json file is present.
·
Start
typescript Compiler Watcher for automatic conversion of typescript files to
Javascript using below command.
D:\Shrikant\typescript
demo\node_modules\.bin>tsc –w
Note: - It will convert
all typescript files present in same folder or subfolder where tsconfig.json is present.
Or
·
If
you want to manually compile the typescript file then use below command.
D:\Shrikant\typescript
demo\node_modules\.bin>tsc ..\..\fileName.ts
·
Now we are ready to create typescript files.