Issues with setting up HTTPS on localhost with Nuxt 3

Question

I'm trying to set up to run Nuxt 3 with HTTPS for localhost. I've looked at other guides and questions that were already asked online, but they all seem to be using older versions of Nuxt and for some reason, that way does not work anymore. For example, I've tried using this link as a reference on how to set up my nuxt.config.ts file, however, it's not working out for me.

When using the server property, I'm getting the error "server does not exist in type NuxtConfig", however, devServer seems to not give me any errors at least (still not working). Here's my nuxt.config.file

import { fileURLToPath } from "node:url"

export default defineNuxtConfig({
    css: ["~/assets/global.scss"],
    experimental: {
        reactivityTransform: true,
    },
    app: {
        head: {
            htmlAttrs: {
                lang: "en",
            },
        },
    },
    devServer: {
        https: {
            key: fileURLToPath(new URL("~/certs/localhost-key.pem", import.meta.url)),
            cert: fileURLToPath(new URL("~/certs/localhost.pem", import.meta.url)),
        },
    },
})

SSL certificate is created and self-signed using mkcert.

After I generate the SSL certificate and install everything and try to access https://localhost:3000, I get the error "SSL_ERROR_RX_RECORD_TOO_LONG".

I'd really appreciate if someone could help me out with this. I've never done this before so not really sure what I am doing and it's taking a while already to solve.

Answer 1

To anyone stumbling upon this and searching for a different approach.

Simply add,

export default defineNuxtConfig({
  devServer: {
    https: {
      key: 'localhost-key.pem',
      cert: 'localhost.pem'
    }
  },
})

No imports, no file reads. Everything just works perfectly. However,

You do need to add NODE_TLS_REJECT_UNAUTHORIZED=0 environment variable

As of March 22, 2023, The documentation is still not updated but the code is forked and merged with the correct info. So, the docs is due updating only.