Typescript环境搭建

Typescript

搭建环境

1.安装vscode

2.node支持

3.全局安装typescript

• npm install -g typescript  //安装
• npm update -g typescript  //更新

4.配置文件

• tscongig.json

{
  "compilerOptions": {
    "module": "commonjs", //遵循的JavaScript模块规范
    "target": "es5", //编译之后生成的JavaScript文件
    "noImplicitAny": false, //为false时，如果编译器无法根据变量的使用来判断类型时，将用any类型代替。为true时，将进行强类型检查，无法推断类型时，提示错误。
    "sourceMap": true, //编译时是否生成对应的source map文件。这个文件主要用于前端调试。当前端js文件被压缩引用后，出错时可借助同名的source map文件查找源文件中错误位置。
    "allowJs": true,
    "outDir": "js" //编译输出JavaScript文件存放的文件夹。
  },
  "exclude": [
    "node_modules" //编译时需要包含/剔除的文件夹。
  ]
}

• .vscode文件
  • tacks.json

{
    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": [
        "-p",
        "."
    ],
    "showOutput": "always",
    "problemMatcher": "$tsc"
}

• .vscode文件
  • launch.json
  • 点击F5启动编译，选择环境为Node.js。vscode会提示你创建launch.json
  • 再次点击F5启动编译，在【调试控制台】中查看调试信息。

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "program": "${workspaceRoot}/xxx.js"
        }
    ]
}

5.ts编译成js 的两种方式

• 在当前文件里打开终端使用命令：tsc xxx.ts
• 文件配置完然后使用ctr+shift+b启动编译