Next.js Discord

Discord Forum

Deploy yarn monorepo containing Next and NestJS through Vercel CLI

Unanswered
Northeast Congo Lion posted this in #help-forum
Open in Discord
Northeast Congo LionOP
Hello community,
i'm struggle with the deployment of a monorepo structure that contain the front-end as NextJS app and backend as NestJS api.
Through the Vercel Site UI, i can deploy the next front end, but deploying the NestJS using the UI lead to an issue, i can find a way to run the app, the project url on Vercel show the compiled code.

My questions are:
- Is it possible to tell Vercel the run command to start the Nest server ?
- How can i structure the vercel.json file to make the deploy more easy ?

11 Replies

ItetsuLaTable
Hello Rocker
I never tried to run a NestJS app using Vercel but I hope that is possible. By using Vercel UI in project settings you can change the yarn or npm command to run when your app is deploying.

You will be able to select or to type your command to run to start your Nest app
About the vercel.json I dont know much I cant help
Northeast Congo LionOP
hi @ItetsuLaTable thank for your interest in my topic,
I've seen people deploying nestJS on vercel, the only missing part in the process it how to run the nestjs compiled app.
Northeast Congo LionOP
I try to run the dedicated NestJS command to run the build (yarn start:prod) after the buildCommand but (and it's logic) the build never end
Northeast Congo LionOP
I have deployed a clone repo from https://github.com/leduc1901/nestjs-jwt-auth
Deployment work : https://nestjs-jwt-auth-obdcmvt8r-devsbequests-projects.vercel.app/
Northeast Congo LionOP
Finally, the config works for my project !
{
  "version": 2,
  "builds": [
    {
      "src": "/apps/api/src/main.ts",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "/apps/api/src/main.ts",
      "methods": [
        "GET",
        "POST",
        "PUT",
        "DELETE"
      ]
    }
  ]
}
Now how i can add my next front-end ?
Let's see
Northeast Congo LionOP
Near to a resolution 

{
  "version": 2,
  "builds": [
    {
      "src": "/apps/api/src/main.ts",
      "use": "@vercel/node"
    },
    {
      "src": "/apps/store/package.json",
      "use": "@vercel/next"
    }
  ],
  "routes": [
    {
      "src": "/api/(.*)",
      "dest": "/apps/api/src/main.ts",
      "methods": [
        "GET",
        "POST",
        "PUT",
        "DELETE"
      ]
    },
    {
      "src": "/store/(.*)",
      "dest": "/apps/store/.next",
      "methods": [
        "GET",
        "POST",
        "PUT",
        "DELETE"
      ]
    }
  ]
}

That produces
on vercel UI, which seems to be the good folders structure.
But /api and /store produce a 404 😐
Northeast Congo LionOP
Finally deployed 2 front end app with the CLI and build output API, but keep struggle with the NestJS API deployement