vscode下搭建type script环境

1.安装vscode

2.安装npm.

2.1 检查npm

$ node -v
v8.12.0

$ npm -v
6.4.1

2.2 安装typescript

$ npm install -g typescript
C:\Users\andrew\AppData\Roaming\npm\tsc -> C:\Users\andrew\AppData\Roaming\npm\node_modules\typescript\bin\tsc
C:\Users\andrew\AppData\Roaming\npm\tsserver -> C:\Users\andrew\AppData\Roaming\npm\node_modules\typescript\bin\tsserver
+ typescript@3.0.3
added 1 package from 1 contributor in 3.47s

3. 编写第一个ts项目

3.1 用vscode建立ts_first文件夹

3.2 vscode建立tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "noImplicitAny": false,
        "module": "commonjs",
        "removeComments": false,
        "sourceMap": true

        //"sourceMap": false,
        //"outDir": "Golang/TypeScript/",
        //"include":[
        //     "ts"
        // ],
        //"exclude": [
        //     "js"
        // ]
    }
}

3.3 编写ts源文件 ts_first.ts

class Person{
    _name: string;
    constructor(name){
        this._name = name;
    }

    getName(){
        return "get name " + this._name;
    }
}

let person = new Person("i am ch");
console.log(person.getName());

3.3 创建task.json

ctrl+shift+p ——>弹出的命令框中输入“configure tasks”——>选择"tsc: 构建tasks.json"——>自动生成tasks.json

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for the documentation about the tasks.json format
    "version": "2.0.0",
    "tasks": [
        {
            "type": "typescript",
            "tsconfig": "tsconfig.json",
            "problemMatcher": [
                "$tsc"
            ]
        }
    ]
}

3.4 编译

ctrl+shift+B——>选“tsc:构建-tsconfig.json"

生成ts_first.js  和ts_first.js.map

 

3.5 命令行终端执行

PS E:\study\ts\first> tsc .\src\first.ts    
PS E:\study\ts\first> node .\src\first.js
i am Parent-1
i am son     
i am Parent-1
i am daughter
PS E:\study\ts\first> 

4.环境搭建完毕，赶快开始type script学习。