httpswebpackvue.js

How to run Vue.js dev serve with https?

I'm using Vue-cli to create vue project with webpack template. how to run it with https in development using: npm run dev?

Solution

  • Webpack template uses express as the server for development. So just replace 

    var server = app.listen(port)

    with following code in build/dev-server.js

    var https = require('https');
var fs = require('fs');
var options = {
  key: fs.readFileSync('/* replace me with key file's location */'),
  cert: fs.readFileSync('/* replace me with cert file's location */'))
};
var server = https.createServer(options, app).listen(port);

    Please note that in webpack template, http://localhost:8080 will be automatically opened in your browser by using opn module. So you'd better replace var uri = 'http://localhost:' + port with var uri = 'https://localhost:' + port for convenience.