Webpack Dev Server running on HTTPS/Web Sockets Se

Question

Normally in developer mode Webpack runs using HTTP. There is usually a web server serving content through HTTP and webpack using http/websockets on a separate port.

Is it possible to run the web server on https and webpack on https/websocket secure ?

Answer 1

See the webpack docs

There is a flag you can add to the webpack-dev-server command

webpack-dev-server --https 

Answer 2

this for TEST environment only:

you need to configure your webpack-dev-server as follows:

webpack-dev-server --https --cert ./cert.pem --key ./key.pem

however, there is a known error when webpack tries to read the passphrase from the key. please see this link

The easiest work around is to generate a key with no passphrase (I don't know the security consequences of this! but this is for test only) .

To take the passphrase out of your key use this command:

$ openssl rsa -in key.pem -out newKey.pem

and use the new key in the previews configuration line

Answer 3

While the above answer is correct for cli, if you are not in the CLI, you could do something like this (in a gulp task):

var WebpackDevServer = require('webpack-dev-server');

new WebpackDevServer(webpack(WebpackDevConfig), {
    https: true,
    hot: true,
    watch: true,
    contentBase: path.join(__dirname, 'src'),
    historyApiFallback: true
}).listen(1337, 'localhost', function(err, result) {
    if (err) {
        console.log(err);
    }
    console.log('Dev server running at https://localhost:1337');
});