如何将 NestJs 应用部署到 vercel,让别的小伙伴也能够访问到你的接口?🐳🐳🐳

文章开始之前分享两个开源项目,会一直维护的,欢迎 star,如果你感兴趣或者想参与学习,可以加我微信 yunmz777,最近也在找工作 ing,欢迎内推......

浪费你两秒钟时间,我们正文开始!!!

Vercel 是一个云平台,专门为前端开发者设计,用于部署和托管网站和前端应用程序。它提供了简单、快速的部署体验,并且非常适合用于现代的 web 项目,特别是那些构建在 React、Vue、Angular、Next.js 等现代 JavaScript 框架上的项目。

可是他也能部署我们的 NestJs 项目,你是否知道呢?

部署 NestJs 应用到 vercel

在 Vercel 上部署 NestJS 应用需要一些特别的配置,因为 NestJS 是一个构建在 Node.js 上的后端框架,而 Vercel 主要是用于部署前端应用和无服务器函数的平台。

首先我们得先创建一个 nestjs 项目并确保它能够在本地运行,如果该应用需要数据库或其他外部服务,那么请确保这些服务可以从公共网络访问

这些都处理完成之后,我们要在 NestJs 项目根目录之下创建一个名为 vercel.json 的文件,该文件用于指定 vercel 的部署配置,如下所示:

json 复制代码
{
  "version": 2,
  "builds": [
    {
      "src": "dist/main.js",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "dist/main.js"
    }
  ]
}

这个配置假设你的 NestJS 项目被编译到 dist/main.js。确保你的 tsconfig.json 中的编译输出设置正确。

配置完成之后,我们使用要全局安装 vercel cli,如下所示:

bash 复制代码
npm install -g vercel

安装完成之后,执行 vercel -v 能看到如下输出则证明成功了:

在项目目录中打开终端,运行以下命令来登录你的 Vercel 账号:

bash 复制代码
vercel login

因为我们在 vercel 上使用的是 Github 账号登录,并且之后要关联 Github 仓库的,所以这里选择的是 Github 登录,你可以根据需求选择特定的。

登录后,运行以下命令进行部署:

bash 复制代码
vercel

这个命令是需要我们在项目根目录的终端中执行!!!

因为我刚才已经配置了,我这里就不重新写了

在上面的这些选项中,我们来详细讲解一下:

  1. Set up and deploy "~/Desktop/project-name"?:这个选项询问是否要设置并部署位于 ~/Desktop/project-name 目录下的项目。回答"yes"表示你确认要部署这个项目。

  2. Which scope do you want to deploy to? xun082's projects:这个选项询问你想将项目部署到哪个作用域或账户下。这里的 xun082's projects 是我的跟人账号,选择这个意味着你将项目部署到该账户下。

  3. Link to existing project?:这个询问是问你是否想将这次部署链接到一个已经存在的项目。选择"no"意味着你希望创建一个新的项目进行部署。

  4. What's your project's name?:这里让你输入你的项目名称,这个名称将用于在部署平台上标识你的项目。在这个例子中,你输入的是 project-name。

  5. In which directory is your code located?:这个选项询问你的代码位于哪个目录。./ 表示当前目录,意味着你的项目代码就在你执行部署命令的同一个目录中。

当执行完成之后,那么我们就可以看到如下的界面:

当我们访问 Domains 的那个链接时我们就可以访问到我们的 NestJs 服务了。

因为我们的项目是没有添加到 Github 仓库上的,那么我们也可以关联一下 Github 仓库。

点击 Connext git repository,我们会看到这样的页面:

那么这个时候我们就可以选择一个仓库来进行关联了,并且可以选择一个分支,当分支代码发生变更的时候会重新部署,默认是 main 分支。

总结

通过上述步骤我们就可以将我们的 NestJs 服务部署到公网上了,如果将我们已经提前部署有了数据库服务或者使用免费的数据库服务,那么这个方法一定是开发个人项目的一个好神器。

相关推荐
瓜牛_gn3 分钟前
依赖注入注解
java·后端·spring
Estar.Lee21 分钟前
时间操作[取当前北京时间]免费API接口教程
android·网络·后端·网络协议·tcp/ip
喜欢猪猪22 分钟前
Django:从入门到精通
后端·python·django
一个小坑货22 分钟前
Cargo Rust 的包管理器
开发语言·后端·rust
bluebonnet2727 分钟前
【Rust练习】22.HashMap
开发语言·后端·rust
uhakadotcom1 小时前
如何实现一个基于CLI终端的AI 聊天机器人?
后端
Myli_ing1 小时前
HTML的自动定义倒计时,这个配色存一下
前端·javascript·html
dr李四维1 小时前
iOS构建版本以及Hbuilder打iOS的ipa包全流程
前端·笔记·ios·产品运营·产品经理·xcode
I_Am_Me_1 小时前
【JavaEE进阶】 JavaScript
开发语言·javascript·ecmascript
Iced_Sheep1 小时前
干掉 if else 之策略模式
后端·设计模式