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')), // 证书
    },
}
相关推荐
Bigger1 天前
后端拒写接口?前端硬核自救:纯前端实现静态资源下载全链路解析
前端·浏览器·vite
San301 天前
现代前端工程化实战:从 Vite 到 React Router demo的构建之旅
react.js·前端框架·vite
Qinana2 天前
从零开始实现 GitHub 仓库导航器(Windows 实操版)
react.js·前端框架·vite
行走的陀螺仪2 天前
Vite & Webpack 插件/Loader 封装完全指南
前端·webpack·node.js·vite·前端工程化·打包构建
AAA阿giao2 天前
从零开始学 React:用搭积木的方式构建你的第一个网页!
前端·javascript·学习·react.js·前端框架·vite·jsx
蜗牛靖子2 天前
使用Trae开发一个自动生成TS类型定义的vite插件
vite
xhxxx2 天前
Vite + React 黄金组合:打造秒开、可维护、高性能的现代前端工程
前端·react.js·vite
San302 天前
现代前端工程化实战:从 Vite 到 Vue Router 的构建之旅
vue.js·vite·vue-router
fighting不想说话3 天前
Vite中resolve.alias原理
vite