Can't get HMR working (browser console errors __hmr 404)

Hello there,

I have problems getting HMR to work. I’m new to the Roots ecosystem, so guess I’m missing something here…

Here’s how I (tried) to install Wordpress with Sage:

  1. used trellis-cli to setup a new project to mytest
  2. navigated to mytest/site/web/app/themes to run composer create-project roots/sage mysage
  3. composer require roots/acorn
  4. trellis up
  5. activated mysage theme
  6. in mysage run yarn dev

Wordpress seems to work fine. Changes to theme files are reflected after a manual reload.

Hot reload is not working though. When I open the browser console, I can see errors popping up every few seconds:
GET http://mytest.test/__hmr net::ERR_ABORTED 404 (Not Found)

I guess I have misconfigured something here? Can anyone help me to dig in the right places?

Thank you very much,

What version of bud are you using? You may try to upgrade to 5.7.6.
(In your theme folder, in package.json change all occurences of 5.7.x to 5.7.6. Then run yarn)

1 Like

Seems like I’m already on 5.76 this is what my package.json looks like

  "name": "sage",
  "private": true,
  "browserslist": [
    "extends @wordpress/browserslist-config"
  "engines": {
    "node": ">=16.0.0"
  "scripts": {
    "dev": "bud dev",
    "build": "bud build",
    "translate": "npm run translate:pot && npm run translate:js",
    "translate:pot": "wp i18n make-pot . ./resources/lang/sage.pot --ignore-domain --include=\"app,resources\"",
    "translate:js": "wp i18n make-json ./resources/lang --pretty-print"
  "devDependencies": {
    "@roots/bud": "5.7.6",
    "@roots/bud-tailwindcss": "5.7.6",
    "@roots/sage": "5.7.6"

Nevermind… it’s working now. While browsing through the configuration files (package.json, theme.json, etc.) I revisited bud.config.js and tried connecting to the IP instead of the proxy.

     * Target URL to be proxied by the dev server.
     * This should be the URL you use to visit your local development server.

     * Development URL to be used in the browser.

Browsing HMR is working!

Thank you



When I use the default serve settings it reloads my changes by scss but changes in Typescript it gives me an notice Nothing hot updated.
I installed browsersync but when I open the localhost URL it gives me HMR errors.

How can I fix this?


@Gydo_Verbeek this topic is solved, please open a new one