-准备工作#

1，GitHub 账户：用于 Fork Umami 仓库。
2，Vercel 账户：用于部署 Umami 和创建 Neon 数据库。
3，Neon 账户：已注册，用于通过 Vercel Storage 连接。
4，一个静态网站，用于嵌入 Umami 的跟踪代码。

步骤 1：Fork Umami 仓库#

1，访问 Umami 官方 GitHub 仓库：https://github.com/umami-software/umami。
2，点击右上角的 Fork 按钮，将仓库 Fork 到你的 GitHub 账户。
3，如果你需要自定义 Umami，可以克隆仓库到本地进行修改，再上传到GitHub 的Umami项目，但本教程使用默认配置。

步骤 2：在 Vercel 部署 Umami#

1，登录 Vercel 官网，点击 Add New > Project。
2，在 Import Git Repository 页面，选择你刚刚 Fork 的 Umami 仓库。
3，配置项目：

• 1.Framework Preset：选择 Next.js（Umami 基于 Next.js 构建）。
• 2.Environment Variables：暂时跳过，稍后配置 Neon 数据库的 DATABASE_URL。

4，点击 Deploy 按钮，Vercel 将自动构建项目（此时可能因缺少数据库连接而失败，稍后修复）。

步骤 3：在 Vercel Storage 创建 Neon 数据库#

1，在 Vercel 仪表板中，进入你的 Umami 项目。
2，点击顶部导航的 Storage 标签，然后选择 Create Database。
3，在数据库类型中选择 Neon，并登录你的 Neon 账户以授权 Vercel 访问。
4，配置数据库：

• 1.项目名称：任意，例如 umami-project。
• 2.数据库名称：建议使用 umami。
• 3.云服务托管商：选择你所在的地区（如 AWS 亚洲区域）以降低延迟。

5，创建完成后，Vercel 会自动生成一个 DATABASE_URL 并将其添加到项目的环境变量中，格式如下：

1
> postgresql://[username]:[password]@[host]/[database]

6，返回项目设置，确认 Environment Variables 中已包含 DATABASE_URL。
7，重新部署项目：点击 Deployments 标签，选择最新部署，点击 Redeploy。

步骤 4：配置 Umami#

1，部署完成后，点击 Visit 查看你的 Umami 实例，记下分配的默认域名（如 your-project.vercel.app）。
2，访问 Umami 网站，首次登录默认账户为：

• 用户名：admin
• 密码：umami

3，登录后立即更改密码以确保安全。
4，在 Umami 仪表板中，点击 Add Website，输入你的网站信息（如域名、名称）。
Umami 会生成一段 JavaScript 跟踪代码，格式如下：

1
 <script async src="https://your-project.vercel.app/umami.js" data-website-id="YOUR_WEBSITE_ID"></script>

步骤 5：在 Hugo 网站中嵌入跟踪代码#

1，将跟踪代码嵌入到网站中即可。
2，如果是博客请查找博客手册网站统计Umami对接的地方，填入”async src”和”website-id”即可。