Apprenez étape par étape comment déployer correctement et rapidement un projet TS Node.js !

Comment déployer correctement et rapidement un projet TS Node.js ? L'article suivant vous apprendra comment déployer une application TS Node.js en quelques minutes. J'espère qu'il vous sera utile !

En tant que développeur full-stack, il est très intéressant de créer des projets. Vous pouvez concevoir l'architecture, réfléchir et développer, mais une fois le développement terminé, nous devons déployer ou publier l'application. Alors, comment déployer un projet TS Node.js correctement et rapidement ? [Apprentissage recommandé : "Tutoriel Nodejs"]

Créer une application TS Node.js

Si vous êtes déjà familiarisé avec la création d'un projet TS Node.js, vous pouvez accéder directement à "Déployer et publier une application". section

Initialiser le projet Node .js :

Dans notre équipe, nous aimons beaucoup TS et utilisons TS dans tous nos nouveaux projets, donc créer un projet TS n'est pas nouveau.

Commençons par le plus basique :

• npm init Initialisez un projet Node.js, utilisez le paramètre -y pour sauter rapidement l'étape par étape. étape de configurationnpm 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

🎜npm install express @types/express Installer les dépendances express et les fichiers de type express pour le développement TS🎜🎜🎜npm install typescript -- save- dev Installer TypeScript en tant que dépendance de développement🎜

# 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"]

🎜Configuration TS🎜🎜

🎜npx tsc -- init créera un fichier de configuration par défaut dactylographié tsconfig.json🎜declaration est utilisé pour spécifier s'il faut générer le fichier *.d.ts correspondant une fois la compilation terminée. is false🎜outdir Définit le répertoire compilé TS S'il n'est pas déclaré, l'emplacement du fichier compilé par défaut sera au même emplacement que le fichier source ts

🎜 Exécutez la commande🎜

docker build --tag my-app:test .

🎜Modifiez la configuration suivante🎜

docker run -p 3000:3000 -it my-app:test
# 服务启动成功，运行端口：3000

🎜Créez le fichier d'entrée du projet🎜🎜🎜Créez le fichier server.ts🎜rrreee🎜Après en complétant les étapes ci-dessus, notre répertoire de fichiers La structure est la suivante🎜rrreee

🎜Compiler TS🎜🎜🎜Notre prochaine étape consiste à créer et déployer notre application TS Node.js depuis dans. Dans l'environnement de production, nous n'exécutons pas la version TS, mais devons exécuter le JS compilé. Compilons maintenant le projet🎜🎜Modifiez le fichier package.json et ajoutez la commande suivante🎜🎜🎜🎜npm run tsc compilera notre projet selon la configuration de notre tsconfig.json et le sortira sur le répertoire spécifié🎜🎜🎜npm run start:prod exécutera notre fichier JS compilé🎜rrreee🎜puis le testera localement🎜rrreee🎜accéder à http via le navigateur ://localhost:3000/, l'accès est réussi, puis nous déployons et publions notre application🎜🎜🎜

🎜Déployer et publier des applications🎜🎜🎜Ici, nous utilisons principalement deux méthodes pour compiler le TS compilé projet Distribuer et déployer dans divers environnements🎜

🎜Formulaire de package de dépendances npm🎜Méthode de conteneur Docker

🎜Formulaire de package de dépendances NPM Formulaire 🎜🎜

🎜Hooks de cycle de vie NPM🎜

🎜Certains hooks de cycle de vie spéciaux seront déclenchés lorsque l'opération spécifiée est déclenchée, ici nous utiliserons le hook "préparer", Ce chien sera déclenché une fois avant d'exécuter la commande npm submit pour publier sur NPM. Nous pouvons donc compiler l'application TS à ce moment-là. 🎜

🎜Spécifier les fichiers de publication🎜

🎜Grâce au champ "fichiers", nous pouvons définir quels fichiers doivent être inclus lors de la publication du package NPM. Si cet attribut est omis, le. la valeur par défaut sera [" *"], tous les fichiers seront téléchargés. 🎜🎜Ce qui suit est le package.json modifié🎜rrreee

🎜npm submit🎜

🎜Après avoir modifié la configuration package.json, nous exécutons la commande npm submit pour mettre à jour notre Publiez l'application sur NPM🎜rrreee🎜Output🎜🎜🎜🎜Une fois la sortie réussie, vous pouvez voir qu'il existe un package my-app-xiaoshuai supplémentaire sur npmjs🎜🎜🎜

🎜Conteneur Docker méthode🎜🎜 🎜Pour publier notre application TS Node.js en tant que conteneur, nous créons un fichier de configuration docker Dockerfile dans le répertoire racine du projet. 🎜🎜Écrivons le Dockerfile étape par étape🎜🎜🎜🎜Copiez le fichier compilé dans le conteneur🎜🎜🎜Copiez package.json et package-lock.json dans le conteneur🎜🎜🎜Utilisez npm installInstaller les dépendances🎜🎜🎜Utilisez node build/server.js pour exécuter notre application🎜

# 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/，访问成功

源码

https://github.com/cmdfas/ts-node-express-deploy

总结

今天我们介绍了创建TS Node.js项目和部署它的基础知识，希望对大家有所帮助，能够用在现在或未来的项目中。

更多编程相关知识，请访问：编程视频！！

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!