hmr eer empty response - Troubleshooting

Also valid for kool run yarn run hot or kool run yarn run dev

Problem:

Browser cannot request "HMR" (hot module replacement) server successfully in Laravel Mix or Laravel Vite.

Console errors: net::ERR_CONNECTION_REFUSED or net::ERR_EMPTY_RESPONSE.

Answer:

Publish the HMR's port to the host and change HMR settings to listen on all IPv4 addresses (0.0.0.0).

For the sake of clarity, let's elect port 8080 to publish.

In your kool.yml, apply the following changes:

-npm: kool docker kooldev/node:20 npm +npm: kool docker -p 8080:8080 kooldev/node:20 npm
  • Alternatively, if you don't want to publish the port for your general kool run npm commands, you may add a new entry.

> Laravel Mix

In your webpack.mix.js, include the following changes to the mix.options call.

mix.options({ + hmrOptions: { + host: '0.0.0.0', + port: 8080, + }, });

> Laravel Vite

In your vite.config.js file, include the following changes to the defineConfig call.

export default defineConfig({ + server: { + host: '0.0.0.0', + port: 8080, + }, plugins: [ laravel({ input: ['resources/css/app.css', 'resources/js/app.js'], refresh: true, }), ], });
kool.dev
By choosing "Accept all cookies" you agree to the use of cookies to help us provide you with a better user experience and to analyse website usage. Only the essential cookies are necessary for the proper functioning of our website and cannot be refused.
Check out our Cookie Policy and Privacy Policy for more information.