Using webpack-dev-server and HMR

While developing, instead of using yarn encore dev --watch, you can use the
webpack-dev-server:

1

$ yarn encore dev-server

This serves the built assets from a new server at http://localhost:8080 (it does
not actually write any files to disk). This means your script and link tags
need to change to point to this.

If you're using the encore_entry_script_tags() and encore_entry_link_tags()
Twig shortcuts (or are processing your assets through entrypoints.json
in some other way), you're done: the paths in your templates will automatically point
to the dev server.

You can also pass options to the dev-server command: any options that are supported
by the normal webpack-dev-server. For example: