I have a full-stack application with:
-
Frontend: React + Vite
-
Backend: Express.js server with LangChain and Warden Protocol integration
-
Structure: Both frontend and backend in same directory (examples/typescript/cli-agent/)
The application works locally with:
-
Frontend on localhost:5173
-
Backend API on localhost:3001
Current Configuration:
// vercel.json
{
"version": 2,
"builds": [
{
"src": "src/server/server.ts",
"use": "@vercel/node"
},
{
"src": "package.json",
"use": "@vercel/static-build",
"config": {
"distDir": "dist",
"buildCommand": "npm run build"
}
}
],
"routes": [
{
"src": "/api/(.*)",
"dest": "/src/server/server.ts"
},
{
"handle": "filesystem"
},
{
"src": "/(.*)",
"dest": "/index.html"
}
]
}
Issue:
When deploying to Vercel, I get:
- Error: Debug Failure during deployment
- Project settings error suggesting to remove .vercel directory
Questions:
-
What’s causing the Debug Failure error?
-
How should I properly configure Vercel for a full-stack application with both frontend and serverless functions?
-
Is there a better way to structure this for Vercel deployment?
Any insights would be appreciated!