vite-plugin-http2

README for english

!vite-http2.jpg

> npm i vite-plugin-http2

vite-plugin-http2 是一个 vite 插件，是为了解决 vite 无法同时开启 proxy 代理以及 http2的问题

支持正常 http2 以及 websocket 转发

这个插件可以解决一下难题

- 使用 devcert 库自动生成 https 证书，并且自动配置在系统内部（第一次进入开发环境，需要输入密码将证书放入系统指定目录）
- 使用 http2-proxy 进行代理转发。

``javascript
// vite.config.js

import http2 from 'vite-plugin-http2';

export default {
plugins: [
http2 ({
// 如果你的开发环境只是用 localhost 开发，这个配置项可以忽略
certificateDomain: ['my-test.xxx.com'],
proxy: {
// 创建正则表达式的字符串，这里识别需要代理的接口
'^/api': {
hostname: 'localhost',
port: 7001,
async onReq(req, options) {
// 如果路径需要修改，可以在这里修改添加
options.path = /prefix/${options.path};
}
},
'^/ws/connect/': {
ws: true, // 支持 websocket 转发
hostname: 'xxx.com',
protocol: 'http or https',
},
},
// 如果 https 证书创建失败，可以自己创建，并在这里传入
ssl: {
key: '',
cert: '',
}
}),
]
};

`


| key | desc | default |
| ------------------|---------------------------------------------------------------------------------------------| --------------- |
| proxy | proxy http2-proxy options | - |
| certificateDomain | HTTPS certificate domain name | ['localhost'] |
| ssl | if devcert create certificate fail，you can pass your ssl option | - |

使用过程中 https 证书创建失败，或出现诡异问题，可使用此命令清除证书创建的缓存。

重启开发环境后，便可重新创建 https 证书。

`
// mac

rm -rf ~/Library/"Application Support"/devcert/

``