Deploying while Vite dev server is active causes broken URLs due to public/hot file existing

I’m using the full Roots stack (Trellis, Bedrock, Sage 11 with Vite). Everything works fine locally, but I’ve run into a problem when deploying.

If I have the dev server running (npm run dev) at the time of deployment, the file web/app/themes/sage/public/hot is present in my local project and gets synced to the production server via Trellis (synchronize task).

This file causes Sage to load assets from http://[::1]:5173, which completely breaks the site in production: I get CORS errors, fonts fail to load, and JS is blocked.

I know this is easy to fix (e.g., --exclude=hot in the synchronize task or removing the file before deploying), but I wonder:

  • Should this be mentioned in the official documentation?
  • Could hot be excluded by default in the example build-before.yml?
  • Are there any best practices for preventing this, especially on teams with multiple developers?

Any thoughts or recommendations are very welcome. Thanks!

1 Like

My workaround was adding the /public/hot path to .gitignore in the Sage theme folder.

AFAIK, this won’t work with Trellis, since it uses Ansible’s synchronize module (rsync) to copy files directly from the local filesystem — not from Git. So even if public/hot is in .gitignore, it will still be copied to the server if it exists locally.

1 Like

We could, but there’s potentially more issues that could occur when deploying the theme when the dev server is running besides just the public/hot file existing

Don’t deploy from your local machine. Some resources to look at:

3 Likes

I’ve been setting up automated deployment with GitHub Actions over the past few days, and I ended up writing a guide to keep track of everything. Thought I’d share it here in case it’s useful to someone—or if anyone wants to chime in with improvements.