单独部署Alist前端以优化体验

这几天折腾了下部署 Alist 在服务器上，但是因为套了 Cloudflare 感觉有点慢，于是决定单独部署 Alist 前端在 Cloudflare Pages 上。

0. 准备

• Github 账号
• Cloudflare / Vercel 或其他部署平台的账号

1. 部署 Alist

参考 Alist 的安装文档正常安装。

部署时注意以下几点：

• config.json中site_url的值为空值或是你计划部署的域名
• 部署 SSL 证书（通过官方文档 / 反向代理 / Cloudflare Tunnel 均可）

2. 修改配置文件

首先，Fork alist-web 这个仓库到自己的账户下。

配置 API

修改 .env.production 里的域名为自己的域名（即已经部署好的 Alist 访问域名）

\\Example: 

VITE_API_URL = "https://alist.xxx.com/"

添加中文（简体）

默认情况下，仓库里是没有简体中文的语言文件的，所以需要手动下载。

在官方的 Crowdin 界面打包下载中文包，并且放入仓库里

同时修改 .gitigonre 文件防止我们的语言文件被排除

在仓库根目录分别执行 npm i 和 node .\scripts\i18n.mjs 生成中文对应的 i18n 需要的文件

3. 部署前端

这里以 Cloudflare Pages 为例

只需要连接到你 Fork 的仓库，填写以下内容

构建命令：pnpm install && pnpm build
构建输出目录：/dist

稍等一会儿，就部署完成了！

4. 尾声

说实话部署还是有点难度的（特别是没有任何参考文档的情况下）

总之，玩的开心！

也可以来我已经部署完的站点看看！点我前往！