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

Question

EDIT: Updated the text in general to keep it shorter and more concise.

I am trying to configure HTTPS when I run npm run dev so I can t

Answer 1

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.key
chmod 400 server.key
openssl req -new -x509 -nodes -sha256 -days 365 -key server.key -out server.crt

3. Add requirements to the top of the nuxt.config.js;

import path from 'path'
import fs from 'fs'

4. 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'))
  }
}

Answer 2

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.

Answer 3

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!