Make use of mkcert to generate a self-signed certificate for local development.

Install mkcert

brew install mkcert

mkcert documentation can be found here on Github.

Install the root CA

mkcert -install

This sets up a root CA in the system’s trust store. You only need to do this once.

Create the certificate and private key for your local URL

mkcert example.com localhost 127.0.0.1 ::1

This will generate 2 files, an example.com+3.pem certificate file and an example.com+3-key.pem private key file. You then need to configure your server to use them.

I use webpack so in the webpack.config I set the dev server to use the files:

Note: the root CA file will be installed within the mkcert folder itself. On Mac, this is within Library/Application Support/mkcert on Windows it is AppData\Local\mkcert

// webpack.config.js
devServer: {
    // ...
    https: {
        key: fs.readFileSync("./example.com+3-key.pem"),
        cert: fs.readFileSync("./example.com+3.pem"),
        ca: fs.readFileSync("~/Library/Application Support/mkcert/rootCA.pem")
    }
    // ...
}