這篇文章也可以在我的博客上找到：https://hamidreza.tech/nestjs-on-vercel。

如果您使用 Express 適配器，本指南會(huì)很有幫助。對(duì)于使用 Fastify 適配器的 NestJS 應(yīng)用程序，這些鏈接可能會(huì)有所幫助：

• https://fastify.dev/docs/latest/Guides/Serverless/#vercel

• https://github.com/vercel/examples/tree/main/starter/fastify

？您可以在此 GitHub 存儲(chǔ)庫(kù)中訪問(wèn)本文中討論的完整源代碼：https://github.com/mahdavipanah/nestjs-on-vercel

Vercel 對(duì) Express 應(yīng)用程序的支持

Vercel 提供了一項(xiàng)便捷的功能，用于通過(guò)以下方式部署 Express 應(yīng)用程序：

1. 在 API 中公開(kāi) Express 應(yīng)用對(duì)象。

2. 定義一個(gè)重寫規(guī)則，將所有傳入流量定向到此單個(gè) API。

我按照 Vercel 的官方 Express 部署指南來(lái)部署 NestJS，方法類似地公開(kāi) NestJS 的底層 Express 應(yīng)用對(duì)象。

第 1 步 - 創(chuàng)建一個(gè) NestJS 應(yīng)用程序

如果您已經(jīng)設(shè)置了 NestJS 應(yīng)用，請(qǐng)?zhí)^(guò)此步驟。

安裝 NestJS 并創(chuàng)建一個(gè)新應(yīng)用程序：

nest new my-app

第 2 步 - 安裝必要的 NPM 軟件包

npm install express @nestjs/platform-express
npm install -D @types/express

步驟 3 - 創(chuàng)建 src/AppFactory.ts 文件

此文件用作管理所有必要的 NestJS 應(yīng)用程序引導(dǎo)的單個(gè)模塊，并導(dǎo)出 NestJS 應(yīng)用程序及其底層 Express 應(yīng)用程序?qū)ο蟆?/p>

在項(xiàng)目根目錄的 src 目錄中創(chuàng)建一個(gè)名為 AppFactory.ts 的文件：

import { ExpressAdapter } from '@nestjs/platform-express';
import { NestFactory } from '@nestjs/core';
import express, { Request, Response } from 'express';
import { Express } from 'express';
import { INestApplication } from '@nestjs/common';
import { AppModule } from './app.module.js';

export class AppFactory {
  static create(): {
    appPromise: Promise<INestApplication<any>>;
    expressApp: Express;
  } {
    const expressApp = express();
    const adapter = new ExpressAdapter(expressApp);
    const appPromise = NestFactory.create(AppModule, adapter);

    appPromise
      .then((app) => {
        // You can add all required app configurations here

        /**
         * Enable cross-origin resource sharing (CORS) to allow resources to be requested from another domain.
         * @see {@link https://docs.nestjs.com/security/cors}
         */
        app.enableCors({
          exposedHeaders: '*',
        });

        app.init();
      })
      .catch((err) => {
        throw err;
      });

    // IMPORTANT This express application-level middleware makes sure the NestJS app is fully initialized
    expressApp.use((req: Request, res: Response, next) => {
      appPromise
        .then(async (app) => {
          await app.init();
          next();
        })
        .catch((err) => next(err));
    });

    return { appPromise, expressApp };
  }
}

第 4 步 - 修改 src/main.ts 文件

默認(rèn)情況下，NestJS 有一個(gè) src/main.ts 文件作為應(yīng)用程序的入口點(diǎn)，包括所有配置和引導(dǎo)。修改此文件以將所有內(nèi)容移動(dòng)到 AppFactory.ts 文件中，僅保留監(jiān)聽(tīng)方法的調(diào)用：

import { AppFactory } from './AppFactory.js';

async function bootstrap() {
  const { appPromise } = AppFactory.create();
  const app = await appPromise;

  await app.listen(process.env.PORT ?? 3000);
}
bootstrap();

第 5 步 - 添加 api/index.ts 文件

默認(rèn)情況下，Vercel 運(yùn)行時(shí)會(huì)構(gòu)建項(xiàng)目的 /api 目錄中創(chuàng)建的任何函數(shù)并將其提供給 Vercel (doc)。由于 Vercel 理解并處理 Express 應(yīng)用程序?qū)ο螅虼嗽诖四夸浿袆?chuàng)建一個(gè)導(dǎo)出 Express 應(yīng)用程序?qū)ο蟮暮瘮?shù)：

/**
 * This file exports Express instance for specifically for the deployment of the app on Vercel.
 */

import { AppFactory } from '../src/AppFactory.js';

export default AppFactory.create().expressApp;

第 6 步 - 添加 vercel.json 文件

在項(xiàng)目根目錄下創(chuàng)建一個(gè)名為 vercel.json 的文件來(lái)配置 Vercel。在這里，為 Vercel 定義一個(gè)重寫規(guī)則，以使用 Express 應(yīng)用來(lái)服務(wù)所有傳入流量 (doc)。

您還可以使用 api 目錄中的 tsconfig.json 文件來(lái)配置 Vercel 的 TypeScript 編譯器。除了 “路徑映射” 和 “Pr對(duì)象參考s” 之外，大多數(shù)選項(xiàng)均受支持。

nest new my-app

第 7 步 - 在 Vercel 上創(chuàng)建項(xiàng)目

恭喜？！我們快完成了?，F(xiàn)在，創(chuàng)建一個(gè) git 存儲(chǔ)庫(kù)并將源代碼推送到其中。然后，轉(zhuǎn)到您的 Vercel 帳戶，創(chuàng)建一個(gè)新項(xiàng)目，并導(dǎo)入 git 存儲(chǔ)庫(kù)。您還可以使用本文的示例 GitHub 存儲(chǔ)庫(kù)。

以上是Vercel 上快速、簡(jiǎn)單的 NestJS 應(yīng)用程序部署的詳細(xì)內(nèi)容。更多信息請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！