前言
本项目的前端是使用Vue3技术。因为用到了Vite做代理解决跨域问题，所以部署到Netlify需要多做一些步骤。
使用Vite代理后，如果前端是在本地部署，需要添加VITE_PROXY环境变量。
例如在 .env.development 文件中添加 VITE_PROXY=[["/api/v1","https://xx.naihe.me/api/v1"],["/ws","wss://xxx.naihe.me/ws"]]
netlify使用教程
使用Netlify部署的话，需要在前端项目的根目录创建一个 netlify.toml 配置文件。
下面简要说明一下Netlify配置文件的用法：
from: 你想重定向的大小写路径。特殊字符必须是URL编码的。to： 你想重定向到的URL或路径。特殊字符必须是url-encoded。status： 你想在重定向中使用的HTTP状态代码；默认为301。force（强制）： 是否覆盖路径中的任何现有内容；默认为假。请访问阴影说明以了解更多细节。query： 查询字符串参数，必须与重定向相匹配。请访问查询参数说明了解更多细节。conditions（条件）： 匹配重定向的条件，包括国家、角色和cookie存在条件。headers： 在代理重定向中发送的额外请求头。signed（签名）： 签名代理重定向的环境变量的名称。
了解语法糖后，可以看看 netlify.toml 的使用示例：
[[redirects]]
from = "/old-path"
to = "/new-path"
status = 301
force = false
query = {path = ":path"}
conditions = {Language = ["en"], Country = ["US"], Role = ["admin"]}
## 此规则将重定向到外部API，使用秘密对请求进行签名
[[redirects]]
from = "/search"
to = "https://api.mysearch.com"
status = 200
force = true # COMMENT: ensure that we always redirect
headers = {X-From = "Netlify"}
signed = "API_SIGNATURE_TOKEN"
部署过程及踩坑
在本项目中，配置的netlify.toml 如下：
[[redirects]]
from = "/api/*"
to = "https://xxx.naihe.me/api/:splat"
status = 200
force = true
使用起来很简单也易上手。在使用过程中，我发现在netlify.toml 的 redirects 不能使用环境变量。还有不能重写websocket协议，也就是说只能重写http和https协议。
部署方式有三种：在线存储库 GitHub、Gitlab等、网站模板和手动上传方式。
本次部署采用手动上传方式，部署过于简单，下面采用文字简要描述。
部署步骤 Team overview -> Add new site -> Deploy manually -> Drag and drop your site output folder here Or, browse to upload
上传选择 Vue Build 生成的 dist 文件夹，上传完毕后会跳转到部署好的网站控制面板
