TypeScript - 环境设置

原创
admin 4个月前 (08-10) 阅读数 23 #Typescript

TypeScript - 环境设置

我们已经在线设置了TypeScript编程环境,这样您在进行理论学习的同时可以执行所有可用的示例。这使您对所学内容更有信心,并能使用不同选项检查结果。请随时修改任何示例并在线执行。

var message:string = "Hello World" 
console.log(message)

编译后,它将生成以下JavaScript代码。

var message = "Hello World";
console.log(message);

在本章中,我们将讨论如何在Windows平台上安装TypeScript。我们还将介绍如何安装Brackets IDE。

您可以通过在www.typescriptlang.org/Playground使用TypeScript来测试您的脚本。在线编辑器显示了编译器发出的相应JavaScript。

您可以使用Playground尝试以下示例。

var num:number = 12 
console.log(num)

编译后,它将生成以下JavaScript代码。

var num = 12;
console.log(num);

上述程序的输出如下所示:

12

本地环境设置

TypeScript是一种开源技术。它可以在任何浏览器、任何主机和任何操作系统上运行。您需要以下工具来编写和测试TypeScript程序:

文本编辑器

文本编辑器帮助您编写源代码。一些编辑器的例子包括Windows记事本、Notepad++、Emacs、vim或vi等。使用的编辑器可能因操作系统而异。

源文件通常以.ts扩展名命名

TypeScript编译器

TypeScript编译器本身是一个.ts文件,被编译成JavaScript(.js)文件。TSC(TypeScript编译器)是一个源到源的编译器(转译器/转换器)。

TSC生成传递给它的.ts文件的JavaScript版本。换句话说,TSC从作为输入给出的TypeScript文件生成等效的JavaScript源代码。这个过程称为转译。

然而,编译器会拒绝传递给它的任何原始JavaScript文件。编译器只处理.ts.d.ts文件。

本TypeScript教程基于最新的TypeScript 5.5.2版本。

安装Node.js

Node.js是一个开源的、跨平台的JavaScript运行环境。Node.js是在没有浏览器支持的情况下运行JavaScript所必需的。它使用Google V8 JavaScript引擎执行代码。您可以下载Node.js源代码或针对您平台的预构建安装程序。Node可在以下位置获取:https://nodejs.org/en/download

在Windows上安装

按照以下步骤在Windows环境中安装Node.js。

步骤1 - 下载并运行Node的.msi安装程序。

步骤2 - 要验证安装是否成功,请在终端窗口中输入命令node v

步骤3 - 在终端窗口中键入以下命令来安装TypeScript。

npm install -g typescript

在Mac OS X上安装

要在Mac OS X上安装node.js,您可以下载预编译的二进制包,这样可以方便轻松地安装。访问http://nodejs.org/并点击安装按钮下载最新包。

通过遵循安装向导从.dmg安装包,这将同时安装node和npm。npm是Node包管理器,它促进node.js附加包的安装。

在Linux上安装

在安装Node.js和NPM之前,您需要安装许多依赖项。

  • RubyGCC。您需要Ruby 1.8.6或更高版本和GCC 4.2或更高版本。

  • Homebrew。Homebrew是一个最初为Mac设计的包管理器,但它已被移植到Linux上,称为Linuxbrew。您可以在http://brew.sh/了解更多关于Homebrew的信息,在http://brew.sh/linuxbrew了解Linuxbrew。

安装这些依赖项后,您可以在终端上使用以下命令安装Node.js:

brew install node.

IDE支持

TypeScript可以在多种开发环境中构建,如Visual Studio、Sublime Text 2、WebStorm/PHPStorm、Eclipse、Brackets等。这里讨论Visual Studio Code和Brackets IDE。这里使用的开发环境是Visual Studio Code(Windows平台)。

Visual Studio Code

这是Visual Studio的一个开源IDE。它适用于Mac OS X、Linux和Windows平台。VScode可在以下位置获取:https://code.visualstudio.com/

在Windows上安装

步骤1 - 下载Windows版的Visual Studio Code

步骤2 - 双击VSCodeSetup.exe启动安装过程。这只需要一分钟。

步骤3 - IDE的截图如下所示。

步骤4 - 您可以通过右键单击文件→在命令提示符中打开直接遍历文件路径。同样,"在资源管理器中显示"选项在文件资源管理器中显示文件。

在Mac OS X上安装

Visual Studio Code的Mac OS X特定安装指南可在以下位置找到:

https://code.visualstudio.com/Docs/editor/setup

在Linux上安装

Visual Studio Code的Linux特定安装指南可在以下位置找到:

https://code.visualstudio.com/Docs/editor/setup

Brackets

Brackets是由Adobe Systems创建的免费开源Web开发编辑器。它适用于Linux、Windows和Mac OS X。Brackets可在http://brackets.io/获取。

Brackets的TypeScript扩展

Brackets通过扩展管理器支持扩展以添加额外功能。以下步骤解释了如何使用相同的工具安装TypeScript扩展。

  • 安装后,点击编辑器右侧的扩展管理器图标,在搜索框中输入typescript。

  • 安装Brackets TSLint和Brackets TypeScript插件。

您可以通过添加另一个扩展Brackets Shell在Brackets本身内运行DOS提示符/Shell。

安装后,您将在编辑器右侧找到一个Shell图标。一旦点击该图标,您将看到如下所示的Shell窗口:

注意 - TypeScript也可作为Visual Studio 2012和2013环境的插件(https://www.typescriptlang.org/#Download)。VS 2015及更高版本默认包含TypeScript插件。

现在,您已经准备就绪!!!

版权声明

本文仅代表作者观点,不代表本站立场。
本文系作者授权本站发表,未经许可,不得转载。

作者文章
热门
最新文章
标签列表