[▲ Vercel Community](/) · [Categories](/categories) · [Latest](/latest) · [Top](/top) · [Live](/live)

[Help](/c/help/9)

# Problems with `api/index.js` source code when deploying Express app

239 views · 1 like · 3 posts


Younyikim (@younyikim) · 2024-07-22

<!-- Be sure to include all detail needed to let others see the same problem -->

### Summary

Hello, I'm trying to deploy a server of a particular package in monorepo using vercel. When I test it with `vercel dev` in my local environment, my api work fine. But after I deploy the production, when I go to the deployed link, I always see only the `api/index.js` source code. And Runtime Log doesn't show anything. Any tips for solving it?

### Example

Deploy Link : https://all-about-dog-server.vercel.app/

### Steps to Reproduce

I have configured the server code as below:

1. `vercel.json`

* I checked the [Using Express.js with Vercel](https://vercel.com/guides/using-express-with-vercel)document and configured vercel.json as below.

```
{ "version": 2, "rewrites": [{ "source": "/(.*)", "destination": "/api" }] }
```

2. `package.json`

* I understand that Vercel's deployment path should be under the `/api` directory. So I wrote a `vercel-build` script to bundle the source code of the `app` directory and store it in the `api` directory.
=> Could there be a problem with this method?

```
{
  "name": "@all-about-som/server",
  "version": "1.0.0",
  "description": "All about dog server",
  "main": "index.js",
  "scripts": {
    "start": "nodemon --exec ts-node -r tsconfig-paths/register app/index.ts",
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "tsup app --clean --format cjs,esm --env.NODE_ENV production",
    "vercel-build": "tsup app --clean --format cjs --env.NODE_ENV production --env.DEPLOYMENT_ENV vercel --out-dir api"
  },
```

3. `mongo db Setting`

* I confirmed that the link between MongoDB Atlas and Vercel is also working well.
  * IP Address set to 0.0.0.0/0
  * MongoDB Atlas is linked to Vercel's Integrations
  * `MONGODB_URI` is set in Vercel's Environment Variables (id, pw match)

4. Vercel Build & Development Settings

* Output Directory : `.`

Fortunately, since it is a private project, I share the entire code as below:

Github : https://github.com/younyikim/younyikim-playground/tree/main/apps/all-about-som/server

Since there is no explanation in English on how to execute the project, I leave a separate guide here.

* You can go to [Project Root](https://github.com/younyikim/younyikim-playground), clone the repository, install dependency through `pnpm i` and run it.
* The project can be accessed directly from Root using the `pnpm all-about-some:server` command.
  * ex) `pnpm all-about-som:server start`, `pnpm all-about-som:server vercel dev`
  * Alternatively, you can access it by going directly to `cd apps/all-about-some/server`.

Any ideas?


Amy Egan (@amyegan) · 2024-07-22

Thanks for sharing these details! Express.js apps need to be modified slightly to adapt to a serverless environment. I recommend following the https://vercel.com/guides/using-express-with-vercel guide for the structure of your `server` project. Switching from an `/app` directory to an `/api` directory will indicate the `index.ts` file is the a serverless function instead of a static file.

You can see what Serverless Functions were detected for a deployment from the dashboard. Go to the overview page for the deployment, then expand the **Deployment Summary**, and expand **Functions** to see the paths for all functions that were created. If none are shown, then there were none detected when the site was building.

You can also check the structure of the deployed site by navigating over to the **Source** tab, then toggling over to the **Output** file tree. Symbols next to the file names indicate whether something is a static file, a serverless function, or middleware.


Younyikim (@younyikim) · 2024-07-23 · ♥ 1

I hope it will help those who are experiencing similar problems and leave my solution.

First of all, as mentioned in the above comment, I changed the `app` directory to the `api` directory. And, moving the `/routes` directory from root to `api` solved the problem. (`/routes` -> `/api/routes`)