DEV Community

loading...
Cover image for [Vite] Enabling https on localhost

[Vite] Enabling https on localhost

web2033 profile image Eugene Kopich Originally published at github.com ・1 min read

Running your site locally with HTTPS using mkcert
https://github.com/FiloSottile/mkcert

Install mkcert package (Windows 10)

choco install mkcert

global install (one time)

mkcert -install

then in project folder

mkcert localhost

Created a new certificate valid for the following names 📜 "localhost"
The certificate is at "./localhost.pem" and the key at "./localhost-key.pem" ✅ It will expire on 18 June 2023 🗓

Edit vite.config.js

import { defineConfig } from 'vite'
const fs = require('fs')

export default defineConfig({
  server: {
    open: true,
    https: {
      key: fs.readFileSync('localhost-key.pem'),
      cert: fs.readFileSync('localhost.pem'),
    },
  },
})
Enter fullscreen mode Exit fullscreen mode

Discussion (1)

pic
Editor guide
Collapse
liuweigl profile image
liuwei

Now you can do it with vite-plugin-mkcert.