vite如何配置https

vite 配置 https

1、安装所需命令

js 复制代码
// 创建证书颁发机构
// 将生成一个根证书 ca.crt 和对应的私钥 ca.key
npx mkcert create-ca

// 创建证书
// 为特定域名生成的证书cert.crt、对应的私钥cert.key

mkcert create-cert

对生成ca.crt进行安装

注意的是安装证书存储选择受信任的根证书颁发机构,其他操作闭眼睛一路通过即可
  • 双击ca.crt
  • 点击安装证书
  • 存储位置选择 当前用户 其实哪都行 然后下一步
  • 选择将所有证书都放入下列存储
  • 点击 浏览 选择 受信任的根证书颁发机构 确定
  • 无脑下一步 完成

vite 中配置证书

js 复制代码
import { resolve } from 'path'
import fs from 'node:fs'

server: {
host: '0.0.0.0',
    https: {
      key: fs.readFileSync(resolve(__dirname, 'cert.key')), // 私钥
      cert: fs.readFileSync(resolve(__dirname, 'cert.crt')), // 证书
    },
}
相关推荐
梵得儿SHI11 小时前
Vue 项目实战与性能优化全攻略:从代码、渲染到首屏,一站式解决卡顿慢加载
前端·vue.js·性能优化·vite·前端面试·前端优化·首屏优化
天蓝色的鱼鱼2 天前
Vite 8 换上 Rolldown 后,前端构建真的会快很多吗?
前端·vite
裕波3 天前
Vue&ViteConf 2026 将于 7 月 18 日在上海举办,尤雨溪将现场发表主题演讲
vue.js·vite
鲁班小子5 天前
Vite resolve.dedupe 使用教程
vue.js·vite
kyriewen8 天前
从Webpack到Vite:我们迁移了一个10万行代码的项目,总结了这7个坑
前端·webpack·vite
大家的林语冰8 天前
尤雨溪官宣:Vite+ 全员加盟 Cloudflare,正式进军全栈开发和 AI 部署云平台!
前端·javascript·vite
明月_清风10 天前
爆破前端生态!Cloudflare 收购 Vite 背后,前端开发者会迎来什么变化?
前端·vite
Anesthesia丶13 天前
Vite + Svelte + shadcn-svelte 最小化 Demo+Vue3语法对比总结
vue·vite·svelte·shadcn-svelte
曲幽17 天前
写页面时别再把 Element Plus 整个搬进来啦!Vue3按需加载的坑我帮你踩平了
vue3·web·vite·icon·element plus·vs code·import·unplugin
Linsk20 天前
一个案例教你彻底搞明白`AbortController` 、`AbortSignal`
vite·前端工程化