我們應該如何（以及為什么）要將Typescript與Express、nodejs一起使用（譯文）

Winer 發(fā)布于2019-08-26 13:23 / 745人閱讀

摘要：在整篇文章中，我將解釋如何使用以及為什么去使用。如果沒有，這兩個錯誤將被忽視，導致最終應用程序出現(xiàn)一些錯誤。我們可以在從其他文件導入的類中使用自動完成功能。維護的難度是和開發(fā)人員避免將大型項目遷移到的主要原因之一。

在我的職業(yè)生涯開始時，我是一名桌面應用開發(fā)人員，其中強類型語言占據(jù)了市場主導地位。
當我遷移到Web開發(fā)時，我對JavaScript和Python等語言的每個新功能都很著迷。事實上，我沒有必要聲明變量的類型，這極大的提高了我的生產(chǎn)力，并且使我的工作變得更有趣了。
所以我第一次聽說TypeScript時，腦海中的第一個想法是這個語言的演變是不是倒退了一步。

我改變了主意嗎？

是的，但這也要取決于具體情況。對于我獨自工作的個人項目，我仍然更喜歡純JavaScript，他的生產(chǎn)力更高。但是，對于那種團隊工作的大型項目，我建議使用TypeScript。在整篇文章中，我將解釋如何使用以及為什么去使用。

生產(chǎn)力與維護

根據(jù)概念定義的，“TypeScript是用于應用程序規(guī)模開發(fā)的JavaScript”。也就是說，我們對項目初始設置的工作可以通過復雜項目的可維護性得到補償。下面我們來看一下為什么會發(fā)生這種情況：

輸入safe = less errors通過在代碼中定義類型，您可以允許IDE在使用僅在運行時感知的類和函數(shù)時確認錯誤。

例：

這里我使用的是Visual Studio Code，它指出了兩個錯誤：
在第6行：我們試圖將字符串參數(shù)傳遞給只接受數(shù)字的函數(shù)。
在第9行：我們試圖將一個返回數(shù)字的函數(shù)的結果賦給字符串。
如果沒有Typescript，這兩個錯誤將被忽視，導致最終應用程序出現(xiàn)一些錯誤。

IDE更容易尋找公開項目模塊

在復雜的項目中，我們有數(shù)百個類分布在多個文件中。當我們定義類型時，IDE能夠?qū)ο蠛秃瘮?shù)關聯(lián)到給它們起源的文件。
當使用control + 單擊從另一個文件導入的方法或類時，IDE將自動導航到導入的文件，突出顯示定義引用的行。

我們可以在從其他文件導入的類中使用自動完成功能。

維護的難度是Java和C＃開發(fā)人員避免將大型項目遷移到JS的主要原因之一。我們可以說，Typescript是一種克服這一障礙的企業(yè)語言。

如何使用Typescript設置Express項目

現(xiàn)在讓我們一步一步地創(chuàng)建一個在Express.js項目中使用Typescript語言的環(huán)境。

npm init

我們現(xiàn)在安裝typescript包。

npm安裝typescript -s

關于Typescript節(jié)點包
Node.js是一個運行Javascript而不是Typescript的引擎。節(jié)點Typescript包允許您將 .ts文件轉換為 .js腳本。Babel也可用于轉換Typescript，但市場標準是使用官方的Microsoft軟件包。

在我們內(nèi)部package.json我們將放置一個名為tsc：

“scripts”：{ 
    “tsc”：“tsc” 
}，

此修改允許我們從項目文件夾中的命令行調(diào)用typescript函數(shù)。所以我們可以使用以下命令：

npm run tsc  -  --init

此命令通過創(chuàng)建tsconfig.json文件來初始化typescript項目。在此文件中，我們將取消注釋該outDir選項，并為要傳遞的已轉換的.js文件選擇一個位置：

安裝express.js

npm install express -s

Express和Typescript包是獨立的。這樣做的結果是Typescript不“知道”Express類的類型。Typescript有一個特定的npm包來識別Express類型。

npm install @ types / express -s

Hello world

為了擁有盡可能最簡單的應用程序，我將使用express.js教程的hello world示例：

var express = require("express");
var app = express();

app.get("/", function (req, res){
    res.send("hello world!");
});

app.listen(3000, function(){
    console.log("Example app listening on port 3000");
})

在我們的項目中，我們將創(chuàng)建一個名為的文件夾app。在此文件夾中，我們將創(chuàng)建一個名為app.ts以下內(nèi)容的文件：

import express = require("express");

// Create a new express application instance
const app: express.Application = express();

app.get("/", function (req, res) {
  res.send("Hello World!");
});

app.listen(3000, function () {
  console.log("Example app listening on port 3000!");
});

編譯我們的第一個應用程序

npm run tsc

如您所見，該命令自動創(chuàng)建了build文件夾和.js文件。

運行express：

node build / app.js

有了這個，我們已經(jīng)在端口3000上運行了一個服務器：

運行TypeScript而不進行轉換

您可以使用ts-node包直接在節(jié)點上運行typescript 。

此軟件包僅建議用于開發(fā)。要在生產(chǎn)中進行最終部署，請始終使用項目的javascript版本。

該ts-node已被包含在另一個包的依賴關系，T ts-node-dev。安裝后，ts-node-dev我們可以運行命令，以便在項目文件發(fā)生更改時重新啟動服務器。

npm安裝ts-node-dev -s

在我們內(nèi)部，packege.json我們將添加兩個腳本：

“scripts”：{ 
    “tsc”：“tsc”，
    “dev”：“ts-node-dev --respawn --transpileOnly ./app/app.ts”，“prod”：“tsc 
    && node ./build/ app.js“ 
}，

要啟動開發(fā)環(huán)境：

npm run dev

要以生產(chǎn)模式運行服務器：

npm run prod

有啥問題可以在評論處給我留言謝謝你的閱讀！

GPU云服務器云服務器我們一起讓我們一起我們一起學貓叫原唱我們一起學貓叫歌曲

文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/108709.html

前端常用技術概述--Less、typescript與webpack

摘要：前言講起前端，我們就不能不講與，在這兩種技術廣泛應用的今天，他們的擴展也是層出不窮，的擴展有等，的超集有等。如下注意你的樣式文件一定要在引入前先引入。截止目前，已經(jīng)發(fā)布了最新的版本。前言：講起前端，我們就不能不講CSS與Javascript，在這兩種技術廣泛應用的今天，他們的擴展也是層出不窮，css的擴展有Less、Sass、Stylus等，js的超集有Typescript等。今天我們就簡...

番茄西紅柿 2019-04-23 11:55 評論0 收藏0
ELSE 技術周刊(2017.10.23期)

摘要：為目前使用范圍最廣的網(wǎng)絡保護協(xié)議。身處攻擊目標周邊的惡意人士能夠利用密鑰重裝攻擊，利用此類安全漏洞。本文和大家一起探討下如何在三年內(nèi)快速成長為一名技術專家。業(yè)界動態(tài) Vue 2.5 released Vue 2.5 正式發(fā)布，作者對于該版本的優(yōu)化總結：更好的TypeScript 集成，更好的錯誤處理，更好的單文件功能組件支持以及更好的與環(huán)境無關的SSR WiFi爆驚天漏洞！KRACK...

galaxy_robot 2019-08-21 17:12 評論0 收藏0
[譯] 函數(shù)式 TypeScript

摘要：談到函數(shù)式編程時，我們常提到機制方法，而不是核心原則。函數(shù)式編程不是關于和這些概念的，雖然它們確實很有用。從根本上來說，函數(shù)式編程就是關于如使用通用的可復用函數(shù)進行組合編程。我們一起用一些函數(shù)式編程的辦法重構這個函數(shù)吧。原文作者：@VictorSavkin原文地址：https://vsavkin.com/functiona...中文翻譯：文藺譯文地址：http://www.wemli...

sPeng 2019-08-20 11:22 評論0 收藏0
前端學習路線

摘要：具體來說，包管理器就是可以通過命令行，幫助你把外部庫和插件放到你的項目里面并在之后進行版本升級，這樣就不用手工復制和更新庫。現(xiàn)在有的包管理器主要是和。一、基礎 1、學習HTML基礎 HTML給你的網(wǎng)頁賦予了結構。它就像是人的骨架那樣讓你保持站立。首先你需要去學習語法以及它必須提供的一切。你的學習應該聚焦在下面這些東西上：學習HTML基礎，了解如何編寫語義HTML 理解如何把網(wǎng)頁分...

FullStackDeveloper 2019-08-22 16:48 評論0 收藏0