Discussion on: How to setup HTTPS locally with create-react-app

ganeshagrawal profile image
Ganesh Agrawal Author

It's my pleasure you liked it. Yes sure, for vue you have to follow these process after generating a certificate:

  1. You have to first note down the path of your local CA. for that run these commands in the bash terminal
# for checking CA path
mkcert -CAROOT
# /home/hades/.local/share/mkcert

cd /home/hades/.local/share/mkcert
# rootCA-key.pem  rootCA.pem
#copy the rootCA.pem path

mkcert ca root

In your vue project root dir create vue.config.js file or made the respective change if already exits:

// vue.config.js
var fs = require('fs');

module.exports = {
  devServer: {
    https: true,
    key: fs.readFileSync('/path/to/server.key'),
    cert: fs.readFileSync('/path/to/server.crt'),
    ca: fs.readFileSync('/path/to/ca.pem'),

Here key & cert file generated at time of localhost certificate generation so use that path. in my case, that was ./.cert/key.pem and ./.cert/cert.pem.
ca path we already copied in the last step that was /home/hades/.local/share/mkcert/rootCA.pem

Note: In most of the case, you do not require to set `ca`. If your browser giving not trusted certificate then use that.

For more reference checkout Docs.

Thanks for reading this article. 😊

Some comments have been hidden by the post's author - find out more