Webpack launch browser automatically

Gulp + live reload serves up my content on localhost and (here's what I'm after) launches the browser automatically at the server url whenever i run the gulp command (i.e I don't have to click the browser icon and navigate to the url manually). Can this be done in Webpack too?

I've tried a plugin called open-browser-webpack-plugin, but I could not get it to work.


Solution 1:

For webpack version 2.x, you just add --open open to the CLI as documented here:

https://webpack.js.org/configuration/dev-server/#devserver-open

Alternatively, add the following config to your webpack.config.js:

devServer: {
  open: true
}

Solution 2:

Emelet answer is not false at all, however it won't work in Windows. I do this with:

"scripts": {
    "start": "start http://localhost:8000/ & webpack-dev-server"
}

100% working and you don't have to install any module or plugin.

Solution 3:

For those using Node.js (and npm): put the command in the npm start script:

MAC

"scripts": {
    "start": "webpack-dev-server & open http://localhost:8080/"
  }

WINDOWS

"scripts": {
    "start": "start http://localhost:8000/ & webpack-dev-server"
}

Thanks to Enzo Ferey for pointing out that the command needs to look different when on Windows.

Solution 4:

To launch the browser, one can add --open to CLI command as the accepted answer points it out

npm start --open

or

ng serve --open

To avoid doing it all the time: there is a simple change to make in package.json

"scripts": {
    "ng": "ng",
    "start": "ng serve --open",
    ...
  },