【vscode】如何在vscode 中配置：TypeScript開發node環境

入門流程，大神繞行。

安裝環境

這就不多說了，安裝開發的環境。

安裝vscode

下載地址：https://code.visualstudio.com/

安裝Nodejs

下載地址：https://nodejs.org

配置

安裝 TypeScript

官網：https://www.typescriptlang.org/

官網上，有文檔，有視頻，有Demo，隱約記得見過中文站，但是現在怎么都找不到了，找到的同學可以告訴我一下。

用node.js的npm安裝TypeScript編譯器

npm install -g typescript

安裝Tpyings

npm install -g typings

typings 主要是用來獲取.d.ts文件。當typescript使用一個外部JavaScript庫時,會須要這個文件，當然好多的編譯器都用它來增加智能感知能力。

配置項目

創建package.json

建一個目錄的文件夾，起一個你喜歡的名字。

node項目嘛，當然要先建立一個package.json

npm init

跟着提示下一步就好了。

創建 tsconfig.json

typescript 的項目都需要一個tsconfig.json

tsc --init

會創建一個這樣內容的tsconfig.json

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

    },
    "exclude": [
        "node_modules"
    ]
}

因為寫node.js你可以修改tagget為es6, 要調試把 sourceMap改為true, 添加allowjs為true,就可以ts和js混合玩了.

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "noImplicitAny": false,
        "sourceMap": true,
        "allowJs": true
    },
    "exclude": [
        "node_modules"
    ]
}

安裝 node 的 .d.ts 庫

還是因為是node.js開發，我們要安裝node的ts庫, 為了強類型，主要還是為了智能感知。

typings install dt~node --global

國內的用typings 的時候，而且就會抽風，好久都完成不了，不要緊，Ctrl+C掉了，再執行，多試幾次，總會有成功的時候的。
typings 現在已經不推薦使用了。現在都用npm來弄。

    npm install @types/node --dev-save

配置 vscode

打開 vscode

code .

windows話 也可以右鍵菜單，open with Code.

配置 TypeScript 編譯

按ctrl + shift + b, 如果沒有配置過，task, 就會在上面提示。

選擇【配置任務運行程序】

會在.vscode文件夾下生成一個 task.json, 基本不用動，我到現在是沒有改過它。

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for the documentation about the tasks.json format
    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": ["-p", "."],
    "showOutput": "silent",
    "problemMatcher": "$tsc"
}

小試身手

我們來創建一個app.ts 文件，隨便寫點東西吧

/**
 * person
 */
class person {
    constructor() {
        
    }

    /**
     * print
     */
    public print() {
        console.log('this is a person')
    }
}

let p = new person();
p.print();

按Ctrl+Shift+B，編譯一下，就會生成一個app.js.

現在運行試試結果吧。