TypeScript 安装与设定

示例

背景

TypeScript是JavaScript的类型化超集,可直接编译为JavaScript代码。TypeScript文件通常使用.ts扩展名。许多IDE都支持TypeScript,而无需任何其他设置,但是TypeScript也可以Node.JS从命令行使用TypeScript包进行编译。

集成开发环境

视觉工作室

  • Visual Studio 2015 包括TypeScript。

  • Visual Studio 2013 Update 2 或更高版本包含TypeScript,或者您可以下载早期版本的TypeScript。

Visual Studio程式码

  • Visual Studio代码(vscode)为TypeScript提供了上下文自动完成功能以及重构和调试工具。vscode本身是在TypeScript中实现的。适用于Mac OS X,Windows和Linux。

网络风暴

  • WebStorm 2016.2随附TypeScript和内置编译器。[网络风暴不是免费的]

IntelliJ IDEA

  • IntelliJ IDEA 2016.2通过Jetbrains团队维护的插件支持Typescript和编译器。[IntelliJ不是免费的]

原子和原子打字稿

  • Atom 支持带有atom-typescript包的TypeScript。

崇高文字

  • Sublime Text 通过typescript包支持TypeScript。

安装命令行界面

安装Node.js

全局安装npm软件包

您可以全局安装TypeScript以从任何目录访问它。

npm install -g typescript

要么

在本地安装npm软件包

您可以在本地安装TypeScript,然后保存package.json以限制到目录。

npm install typescript --save-dev

安装渠道

您可以从以下位置安装:

  • 稳定频道: npm install typescript

  • 测试版频道: npm install typescript@beta

  • 开发频道: npm install typescript@next

编译TypeScript代码

所述tsc编译命令自带typescript,其可用于编译的代码。

tsc my-code.ts

这将创建一个my-code.js文件。

使用tsconfig.json进行编译

您还可以提供通过tsconfig.json文件与代码一起使用的编译选项。要启动一个新的TypeScript项目,cd请在终端窗口中进入您项目的根目录并运行tsc --init。该命令将生成一个tsconfig.json具有最少配置选项的文件,如下所示。

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

将tsconfig.json文件放置在TypeScript项目的根目录下后,您可以使用tsc命令来运行编译。