如何正確快速的部署一個TS Node.js項目

本篇內容主要講解“如何正確快速的部署一個TS Node.js項目”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“如何正確快速的部署一個TS Node.js項目”吧!

作為全棧開發者，創建項目是很有趣的，可以設計架構，頭腦風暴，開發，但在開發結束之后呢，我們就要部署或發布應用。那么如何正確快速的部署一個TS Node.js項目呢，今天我們來搞定它。

創建一個TS Node.js應用

如果你已經熟悉創建TS Node.js項目，可以直接跳到“部署發布應用”部分

初始化Node.js項目：

在我們團隊，我們非常喜歡TS，并且在我們的所有新項目中都會使用TS，因此創建一個TS項目并不新鮮。

讓我們從最基本的開始：

• npm init 初始化一個Node.js項目，使用-y參數可以快速跳過一步一步的配置

• npm install express @types/express 安裝express依賴，和用于TS開發的express的types類型文件

• npm install typescript --save-dev 安裝typescript作為開發依賴

mkdir my-app && cd my-app
npm init -y
npm install express @types/express --save
npm install typescript --save-dev

TS配置

• npx tsc --init 將創建一個typescript默認配置文件tsconfig.json

• declaration 用于指定是否在編譯完成后生成相應的*.d.ts文件，默認為false

• outdir 定義TS編譯后的目錄，如果沒有聲明，默認編譯后的文件位置將和ts源文件在同一位置

運行命令

 npx tsc --init

修改以下配置

"compilerOptions": {
  ...
  "outDir": "dist", // 編譯后輸出目錄
  "declaration": true // 生成 d.ts
}

創建項目入口文件

創建server.ts文件

import express from 'express'
const app = express()
const PORT = 3000

app.use(express.json())

app.get('/', (req, res) => {
  res.send(‘Hello World!’)
})

app.listen(PORT, () => {
  console.log(`Server is listening on port ${PORT}`)
})

完成上述步驟后，我們的文件目錄結構如下

.
├── node_modules
├── package-lock.json
├── package.json
├── server.ts
└── tsconfig.json

編譯TS

我們下一步是構建和部署我們的TS Node.js應用，由于在生產環境中，我們不運行TS版本，而是運行編譯后的JS。下面我們來編譯項目

修改package.json文件增加以下命令

• npm run tsc 將會根據我們tsconfig.json的配置編譯我們的項目，并輸出到指定目錄

• npm run start:prod 將會運行我們編譯后的JS文件

"scripts": {
  "tsc": "tsc",
  "start:prod": "node dist/server.js"
}

然后在本地進行測試

npm run tsc
npm run start:prod

# 服務啟動成功，運行端口：3000

通過瀏覽器訪問http://localhost:3000/，訪問成功，接下來我們部署和發布我們的應用

部署發布應用

這里我們主要采用兩種方法將編譯后的TS項目分發部署到各種環境中

• npm依賴包的形式

• docker容器方式

NPM依賴包的形式

NPM生命周期鉤子

一些特殊的生命周期鉤子會在觸發指定操作時被觸發，這里我們將使用“prepare”鉤子，該狗子會在執行npm publish命令發布到NPM之前被觸發一次。所以我們可以這時編譯的TS應用。

指定發布文件

通過 “files”字段我們可以去定義發布NPM包時應該包括哪些文件，如果省略該屬性默認會為["*"]，會上傳所有文件。

下面是修改后的package.json

"name": "my-app-xiaoshuai", // 我們發布到NPM上的名字
"main": "dist/server.js", // 修改入口文件地址
"types": "dist/server.d.ts", // 指定TS類型文件
"files": [
  "dist",
  "package.json",
  "package-lock.json",
  "README.md"
],
"scripts": {
  "tsc": "tsc",
  "prepare": "npm run tsc"  // 編輯typescript
}

npm publish

在修改完package.json配置后，我們運行npm publish命令，將我們的應用發布到NPM上去

npm publish

輸出

發布成功后，可以看到npmjs上多了一個my-app-xiaoshuai包

Docker容器方式

要將我們的TS Node.js應用作為容器發布，我們要在項目根目錄中創建docker配置文件Dockerfile。

下面我們一步步編寫Dockerfile文件

• 拷貝編譯后的文件到容器內

• 拷貝package.json和package-lock.json到容器內

• 使用 npm install安裝依賴

• 使用 node build/server.js運行我們的應用

# Node 版本
FROM node:14.18.0-alpine

ARG NODE_ENV=production
ENV NODE_ENV $NODE_ENV

COPY ./dist /dist
COPY ./package.json /package.json
COPY ./package-lock.json /package-lock.json

RUN NODE_ENV=$NODE_ENV npm install

EXPOSE 3000

CMD ["node", "dist/server.js"]

現在我們可以在根目錄中構建docker鏡像，運行 docker build --tag my-app:test . 命令

docker build --tag my-app:test .

成功后輸出如下

接著我們運行容器，使用docker run -p 3000:3000 -it my-app:test命令來運行我們的應用，可以看到程序成功運行在3000端口

docker run -p 3000:3000 -it my-app:test
# 服務啟動成功，運行端口：3000

通過瀏覽器訪問http://localhost:3000/，訪問成功

到此，相信大家對“如何正確快速的部署一個TS Node.js項目”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！