How to run NUXT (npm run dev) with HTTPS in localhost? How to run NUXT (npm run dev) with HTTPS in localhost? vue.js vue.js

How to run NUXT (npm run dev) with HTTPS in localhost?


HTTPS on local dev - NUXT style

Solution is described in NUXT documentation:

https://nuxtjs.org/api/configuration-server/#example-using-https-configuration

This may be achieved with:

  1. Go to project main dir;
  2. Create private and public key;
openssl genrsa 2048 > server.keychmod 400 server.keyopenssl req -new -x509 -nodes -sha256 -days 365 -key server.key -out server.crt
  1. Add requirements to the top of the nuxt.config.js;
import path from 'path'import fs from 'fs'
  1. Extend or add configuration of server in nuxt.config.js;
server: {  https: {    key: fs.readFileSync(path.resolve(__dirname, 'server.key')),    cert: fs.readFileSync(path.resolve(__dirname, 'server.crt'))  }}


You must follow the doc spec here https://nuxtjs.org/api/configuration-server/#example-using-https-configuration, BUT you must add code in the server/index.js file, otherwise it won’t work at all.

So in the server/index.js add const https = require('https') at the top and replace :

app.listen(port, host)  consola.ready({    message: `Server listening on http://${host}:${port}`,    badge: true  })

With

https.createServer(nuxt.options.server.https, app).listen(port, host);

And now it’s working!


If for some reason you enable https just like Jan Doleczek said and you also make use of axios module, make sure to disable https like this in nuxt.config.js:

  axios: {    baseURL: 'http://yourapi:8000',    https:false,  },

If you don't do that all your axios request will use https instead of https.