What’s new in webpack dev server 2.0
We’ve got some interesting changes in webpack dev server 2.0 that will hopefully make your life as a developer easier. In this article I want to show you the changes and guide you to fix the few breaking changes.
First, let me introduce myself. At my day-to-day job, I’ve been using webpack dev server for almost two years. I had contributed some things, but I wanted to do more. Last month, I decided to step up and now maintain webpack dev server and webpack dev middleware :).
There are a couple of breaking changes, but also nice changes in the upcoming webpack dev server 2.0 release that I want to show you.
Note that 2.0 is still a Release Candidate. It will be released as stable when webpack 2 stable gets released.
Breaking changes
Compatibility
webpack dev server 2 will only be compatible with webpack 2.
Inline modus on by default
For CLI users, the inline modus is now on by default. This means you can remove — inline from your command. If you don’t want to use inline, add — no-inline as a flag.
For Node API users, nothing changes.
No overriding of output.path
When using the CLI, output.path in your webpack config would always be overridden to “/”. In many cases this introduced unexpected behavior or simply broke plugins.
If you want the old behavior, set output.path to “/”. If you don’t, make sure that output.path is an absolute path.
Node API users have it easy again: nothing changes.
Removal of contentBase as a proxy
Previously, it was possible to use an URL as contentBase. This has been deprecated for a while, and is removed now.
Use the proxy option instead. It can do the same, but is way more powerful.
Nice changes
Less console spam
You’ve probably noticed that after stopping the server, the console in the DevTools would get spammed over time with thousands of error messages about a failure to reconnect;
Unfortunately, it is not possible to hide these errors, but we now use a “back-off” algorithm that exponentially delays the retry, with a max of 10 times.
Also, the “[WDS] Disconnected!” will now only display once.
Even fewer messages in the console
Some people don’t want any messages in the console from webpack dev server. We hear you.
There is a clientLogLevel option now ( — client-log-level for CLI), that allows you to control the log messages in the browser.
Configuration validation
webpack 2 introduced configuration validation. For instance, if you try to use an option that doesn’t exist, it will throw an error. This helps preventing you having to pull your hair out why that option isn’t working! webpack-dev-server will also have configuration validation.
Port 8080 already in use? Don’t worry
By default webpack-dev-server has always used port 8080 to start the server. If that port was already in use, it would fail to start. Now, it will continu searching until it has found an unused port.
Compatibility with web workers and non-web platforms
webpack dev server did not work with Web Workers, or non-web platforms such as Electron or Ionic.
Those platforms are supported now, and Hot Module Replacement should work on them.
HTTP/2
The last beta introduces support for HTTP/2, thanks to node-spdy.
Since HTTP/2 only works with encryption, it will only be enabled when using the https option ( — https for CLI).
We think you’ll love it. — Tim Cook
These were only the highlights. Check out the changelog for all changes.
What’s next
webpack dev server is still not easy to setup, and we know this.
A first step to fixing this will be configuration validation. Some paths can’t be relative, some options can’t be used together. At the moment it is too easy to configure something wrong. If you have specific ideas for validation, feel free to join the discussion!
