The instructions below were written back in 2017. In 2021, running Vue in dev mode with SSL on is much simpler.
To enable https support in Vue dev mode edit the vue.config.js
file that you can find at the root of the project and add https: true
line under devServer
:
module.exports = {
// ... other config ...
devServer: {
https: true,
}
};
Save the file and run the npm run serve
command; it should launch the server at https://localhost:8080
.
### 1. You need self-signed certs at first
Generate them via this command openssl req -nodes -new -x509 -keyout server.key -out server.cert
and put them into a certs dir in the root of your vue webpack project.
const https = require('https')
const fs = require('fs')
to the top of the file.
In build/dev-server.js locate a string server = app.listen(port)
and replace it with
server = https.createServer({
key: fs.readFileSync('./certs/server.key'),
cert: fs.readFileSync('./certs/server.cert')
}, app).listen(port);
Save your changes.
Now type a npm run serve
and your dev server should be avaialable as https://localhost:8080/
Hey, if you've found this useful, please share the post to help other folks find it: