Warning: You are browsing the documentation for Symfony 4.1, which is no longer maintained.
Read the updated version of this page for Symfony 5.3 (the current stable version).
Using webpack-dev-server and HMR
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:
1 | $ yarn encore dev-server --https --port 9000
|
This will start a server at https://localhost:9000.
Note
This Webpack server is independent from Symfony’s development web server and you need to run both separately.
Using dev-server inside a VM¶
If you’re using dev-server from inside a virtual machine, then you’ll need
to bind to all IP addresses and allow any host to access the server:
1 | $ ./node_modules/.bin/encore dev-server --host 0.0.0.0 --disable-host-check
|
You can now access the dev-server using the IP address to your virtual machine on port 8080 - e.g. http://192.168.1.1:8080.
This work, including the code samples, is licensed under a Creative Commons BY-SA 3.0 license.