TypeScript 環(huán)境設(shè)置

2021-12-10 16:31 更新

我們已經(jīng)在線建立了Typescript環(huán)境,因此你可以在進(jìn)行理論工作的同時(shí)在線執(zhí)行所有可用的示例。這使您對(duì)正在閱讀的內(nèi)容充滿信心,并使用不同的選項(xiàng)檢查結(jié)果。隨意修改任何示例并在線執(zhí)行。

使用我們提供的在線編譯器選項(xiàng)嘗試以下示例。

typescript在線運(yùn)行環(huán)境

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

在編譯時(shí),它會(huì)生成以下的JavaScript代碼。

//Generated by typescript 1.8.10
var message = "Hello World";
console.log(message);

在本章中,我們將討論如何在Windows平臺(tái)上安裝TypeScript。我們還將解釋如何安裝Brackets IDE。

Typescript示例

示例:

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

在編譯時(shí),它會(huì)生成以下的JavaScript的代碼:

//Generated by typescript 1.8.10
var num = 12;
console.log(num);

上述程序的輸出如下:

12

本地環(huán)境設(shè)置

打字稿是一種開源技術(shù)它可以在任何瀏覽器,任何主機(jī)和任何操作系統(tǒng)上運(yùn)行您將需要以下工具來編寫和測(cè)試打字稿程序:

文本編輯器

文本編輯器可以幫助你編寫源代碼。一些編輯器的示例包括Windows Notepad,Notepad ++,Emacs,VIM或vi等。使用的編輯器可能因操作系統(tǒng)而異。

源文件通常使用擴(kuò)展名.TS命名。

打字稿編譯器

TypeScript編譯器本身是一個(gè)編譯為JavaScript(.js)文件的.ts文件。該TSC(TypeScript編譯器)是一個(gè)“源到源”的編譯器(transcompiler / transpiler)。

打字稿編譯

該TSC生成傳遞給它的.ts文件的JavaScript的版本。換言之,TSC打字稿從文件生成一個(gè)等效的JavaScript的源代碼作為輸入。這一過程被稱為transpilation。

但是,網(wǎng)絡(luò)出版總庫(kù)編譯期拒絕器將傳遞給它的任何原始的JavaScript文件。編譯器僅處理.TS.d.ts文件。

安裝Node.js

Node.js的是服務(wù)器端JavaScript的一個(gè)開源,跨平臺(tái)的運(yùn)行時(shí)環(huán)境.Node.js需要在沒有瀏覽器支持的情況下運(yùn)行JavaScript。它使用Google V8 JavaScript引擎來執(zhí)行代碼。您可以為您的平臺(tái)下載Node.js源代碼,或者預(yù)構(gòu)建的安裝程序.Node可以在這里獲?。?/font>https://nodejs.org/en/download

在Windows上安裝

按照以下步驟在Windows環(huán)境中安裝Node.js

第1步 -下載并運(yùn)行Node的.msi安裝程序。

下載并運(yùn)行安裝

第2步 -要驗(yàn)證是否安裝成功,請(qǐng)?jiān)诮K端窗口中輸入命令:node –v。

驗(yàn)證安裝

第3步 -在終端窗口中鍵入以下命令來安裝TypeScript。

npm install -g typescript

安裝打字稿

在Mac OS X上安裝

要在Mac OS X上安裝Node.js,你可以下載一個(gè)預(yù)編譯的二進(jìn)制包,這樣可以輕松安裝。前往http://nodejs.org/ ,然后點(diǎn)擊安裝按鈕來下載最新的軟件包。

下載最新包

按照以下安裝向?qū)?dmg安裝包,該向?qū)⑼瑫r(shí)安裝node和npm。npmNode Package Manager,它有助于為node.js安裝其他軟件包。

安裝節(jié)點(diǎn)

在Linux上安裝

在安裝Node.js和NPM之前,需要安裝許多依賴項(xiàng)。

  • RubyGCC。你需要Ruby 1.8.6或更高版本以及GCC 4.2或更高版本。

  • Homebrew 。Homebrew是一個(gè)最初為Mac設(shè)計(jì)的軟件包管理器,但它已經(jīng)作為L(zhǎng)inuxbrew
    移植到Linux。您可以在http://brew.sh/上了解更多有關(guān)Homebrew的信息以及在http://brew.sh/linuxbrew
    上了解更多有關(guān)Linuxbrew的信息。

安裝了這些依賴項(xiàng)后,您可以在終端上使用以下命令安裝Node.js:

brew install node.

IDE支持

TypeScript可以構(gòu)建在大量的開發(fā)環(huán)境中,如Visual Studio,Sublime Text 2,WebStorm / PHPStorm,Eclipse,Brackets等。這里討論Visual Studio Code和Brackets IDE。這里使用的開發(fā)環(huán)境是Visual Studio Code(Windows平臺(tái))。

Visual Studio Code

這是Visual Studio的一個(gè)開源IDE。它適用于Mac OS X,Linux和Windows平臺(tái)。 VScode可以在以下的網(wǎng)址中獲得https://code.visualstudio.com/

在Windows上安裝

第1步 -  下載適用于Windows的Visual Studio Code。

下載Visual Studio代碼

第2步 -雙擊VSCodeSetup.exe(啟動(dòng)安裝過程)以啟動(dòng)安裝過程。這將只需要一分鐘。

安裝向?qū)?></p><p> <strong>第3步</strong> -IDE的屏幕截圖如下。 </p><p><img src=

第4步 - 您可以通過右鍵單擊文件→在命令提示符下打開來直接遍歷文件的路徑。同樣,“在資源管理器中顯示”選項(xiàng)會(huì)在文件資源管理器中顯示該文件。

遍歷文件路徑

在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創(chuàng)建的用于Web開發(fā)的免費(fèi)開源編輯器。它適用于Linux,Windows和Mac OS.XBrackets可以在http://brackets.io/獲得。

括號(hào)

支架的打字稿擴(kuò)展

支架通過Extension Manager(擴(kuò)展管理器)添加額外功能的擴(kuò)展。以下步驟說明使用相同的方法安裝TypeScript擴(kuò)展。

  • 安裝后,點(diǎn)擊編輯器右側(cè)的擴(kuò)展管理器圖標(biāo)(擴(kuò)展管理器)。在搜索框中輸入:typeScript。

  • 安裝Brackets TSLint和Brackets TypeScript插件。

打字稿擴(kuò)展

你可以通過添加多一個(gè)擴(kuò)展Brackets Shell在Brackets中運(yùn)行DOS提示符/ shell。

支架外殼

安裝后,您將在編輯器Shell的右側(cè)找到一個(gè)shell圖標(biāo)(貝殼 )。單擊圖標(biāo)后,您將看到如下圖所示的shell窗口:

殼牌窗口

注意: TypeScript也可作為Visual Studio 2012和2013環(huán)境的插件,環(huán)境(https://www.typescriptlang.org/#Download).VS  2015及以上版本默認(rèn)包含TypeScript插件。

現(xiàn)在,打字稿環(huán)境已經(jīng)設(shè)置好了!



以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)