Deploying an Express app with Swagger UI

Help
4

Thanks for the note. I had actually figured it out by the time you replied through the process of repeated trial and error, and realized I was making several errors that were exacerbated by some pretty important misunderstandings on my part.

The biggest issue was that when I was running vercel locally, it (obviously) had access to all of my local files, including the dist directory on my local machine. Because of that, when vercel didn’t run my build actual build command and instead ran vercel build during deployment, I think it just executed whatever files were there. This wouldn’t have been a problem, except my local package.json’s main pointed at dist/index.js, whereas my actual main should have been dist/src/index.js. So vercel was running a fairly old version of my index file, which did do something but not what I expected and was why none of my changes were being deployed as I would have expected.

When I finally figured this out, and did a clean build locally, deployment broke completely, which led me to realize that the build I thought it was running (“npm run build”) was instead “vercel build”. I thought I was overriding this in my vercel.json file (as shown in the builds array above), but that seems to have not been the case. I went hunting down through the documentation and realized this particular field shouldn’t be used. I then updated both my vercel deployment configuration to run npm run build and updated my vercel.json as follows:

{
  "version": 2,
  "buildCommand": "npm run build",
  "functions": {
    "api/index.js": {
      "includeFiles": "{dist/openapi.yaml,node_modules/swagger-ui-dist/**}"
    }
  },
  "routes": [
    {
      "src": "/(.*)",
      "dest": "api/index.js"
    }
  ]
}

which mostly, kinda, solved the issue.

The one final thing I had to figure out is that vercel seems to really want serverless functions to exist in an “api” directory which I didn’t have at first. To solve this, I created a new index.js file in api that simply called the dist/src/index.js file, and all of a sudden things seem to be working as expected. I’m going to check everything in tonight, and hopefully a build from the branch will work as expected.

So to summarize:

  1. When deploying locally, you’re at risk of providing vercel access to files it shouldn’t normally have (e.g., the dist directory) which if there’s weird behavior during the build, could result in some unexpected behavior.
  2. Manually override your build in your vercel configuration; don’t rely on vercel automagically figuring it out like I hoped it would.
  3. Don’t use “builds” in your vercel.json.
  4. Make the starting point of your serverless function something in an api directory.

If any of these conclusions are wrong, please let me know!

1 Like