I'm using Vercel platform to develop a NodeJS app with two separate folders - frontend (NextJS v12 app) and backend (custom NodeJS with Express). I've set up a minimal example, but after upgrading to NextJS v12, hot reloading stopped working.
I've seen that it's because of the new usage of websockets for HMR at NextJS v12. But didn't find any answer.
This is my vercel.json file:
"version": 2,
"builds": [
{ "src": "/backend/index.js", "use": "@now/node" },
{
"src": "/frontend/package.json",
"use": "@now/next"
}
],
"rewrites": [
{ "source": "/backend/(.*)", "destination": "/backend/index.js" },
{ "source": "/(.*)", "destination": "/frontend/$1" }
]
}
and this is the error:
WebSocket connection to 'ws://localhost:3000/_next/webpack-hmr' failed
Do you have any ideas what to do with it? This is a related issue on NextJS GitHub: https://github.com/vercel/next.js/issues/30491, but no one is mentioning this problem related to the Vercel configuration file. Thanks.
