TS Node.js プロジェクトを正しく迅速にデプロイする方法を段階的に説明します。

TS Node.js プロジェクトを正しく迅速にデプロイするにはどうすればよいですか?次の記事では、TS Node.js アプリケーションを数分でデプロイする方法を説明します。お役に立てば幸いです。

フルスタック開発者として、プロジェクトを作成することは非常に興味深いです。アーキテクチャを設計し、ブレインストーミングし、開発することができますが、開発が完了した後は、アプリケーションをデプロイまたはリリースします。では、TS Node.js プロジェクトを正しく迅速にデプロイするにはどうすればよいでしょうか? 今すぐ実行してみましょう。 [推奨学習: 「nodejs チュートリアル 」]

TS Node.js アプリケーションを作成する

TS ノードの作成にすでに慣れている場合.js プロジェクトでは、「アプリケーションのデプロイとリリース」セクションに直接ジャンプできます。

Node.js プロジェクトを初期化します:

私たちのチームでは、TS がとても気に入っています。 TS はすべてのプロジェクトで使用されるため、TS プロジェクトの作成は新しいことではありません。

基本的なことから始めましょう:

• npm init -y を使用して Node.js プロジェクトを初期化します。パラメーターはすぐに実行できます。ステップバイステップの構成を省略します

• ##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 は、タイプスクリプトのデフォルト構成ファイル tsconfig.json
• declaration を作成します。これは、コンパイルするかどうかを指定するために使用されます。完了後、対応する * .d.ts ファイルが生成されます。デフォルトは false
• outdir TS コンパイル後のディレクトリを定義します。宣言がない場合、デフォルトのコンパイル済みファイルの場所は ts と同じになります。同じ場所で
#コマンドを実行します

 npx tsc --init

次の構成を変更します

"compilerOptions": {
  ...
  "outDir": "dist", // 编译后输出目录
  "declaration": true // 生成 d.ts
}

作成

ファイル<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">import express from &amp;#39;express&amp;#39; const app = express() const PORT = 3000 app.use(express.json()) app.get(&amp;#39;/&amp;#39;, (req, res) =&gt; { res.send(‘Hello World!’) }) app.listen(PORT, () =&gt; { console.log(`Server is listening on port ${PORT}`) })</pre><div class="contentsignin">ログイン後にコピー</div></div>上記の手順を完了すると、ファイル ディレクトリ構造は次のようになります

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

次のステップは、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

ログイン後にコピー

アプリケーションのデプロイと公開

ここでは主に 2 つの方法を使用して、コンパイルされた TS プロジェクトをさまざまな環境に配布およびデプロイします

npm の形式依存関係パッケージ

docker コンテナー メソッド
NPM 依存関係パッケージの形式

NPM ライフ サイクル フック

指定された操作がトリガーされると、いくつかの特別なライフ サイクル フックがトリガーされます。ここでは、「prepare」フックを使用します。これは、NPM に公開する npm pub コマンドを実行する前に 1 回トリガーされます。したがって、この時点で TS アプリケーションをコンパイルできます。

発行ファイルを指定する

「ファイル」フィールドを使用して、NPM パッケージを発行するときにどのファイルを含める必要があるかを定義できます。この属性が省略された場合、デフォルトは["*" ] の場合、すべてのファイルがアップロードされます。

"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 public

package.json 構成を変更した後、npm pub コマンドを実行します。アプリケーションを NPM に公開します

npm publish

ログイン後にコピー

公開に成功すると、npmjs xiaoshuai に追加の my-app- があることがわかります。

Docker コンテナ メソッド

TS Node.js アプリケーションをコンテナとして公開するには、 docker 構成ファイル プロジェクトのルート ディレクトリにある Dockerfile。

• package.json と package をコピーします-lock.json をコンテナーに入れます

• 使用
npm install
• 依存関係をインストールします
  使用
ノード ビルド/サーバー.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/，访问成功

源码

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

总结

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

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

以上がTS Node.js プロジェクトを正しく迅速にデプロイする方法を段階的に説明します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。