关于Vercel

Vercel 是一个面向现代开发者的全球化部署平台,旨在简化部署和托管现代应用程序的流程。Vercel 非常适合个人开发者和小型团队使用,其个人版永久免费,每月提供100GB带宽,适合个人项目部署。此外,Vercel 内置了持续集成/持续部署(CI/CD)功能,只需将项目导入 Vercel ,通过命令即可自动部署。 将个人站点部署到 Vercel ,有两种部署方式:

  1. 源码托管,Vercel 会自动编译成目标文件
  2. 目标文件托管,把 Github Pages 的文件直接导入到 Vercel

安装Vercel

  1. 登录 Vercel 官网, 将 GitHub 或其他 Git 平台上的公有或私有仓库托管到 Vercel
  2. 导入 Git 仓库,以 Github 为例,可以为所有仓库或部分仓库安装 Vercel 应用程序。

源码托管到Vercel

本人比较推荐这种方式。因为每次将源码提交到 GitHub 后即可自动开始编译。省去编译再托管到 GitHub Pages 上的步骤。

  1. 将源代码提交到 GitHub 指定仓库中,可私有或公有。
  2. public 目录不能提交,将 public 目录添加到 .gitignore 文件。
  3. 选择你的源代码仓库,然后点击 Import 按钮。
  4. 项目导入之后,Vercel 会自动识别你的项目框架为 Hugo
  5. 部署命令配置:
    1. Build Command : hugo --gc --minify
    2. Output directory : public
    3. 添加环境变量填写 HUGO_VERSION 及其对应版本号。
  6. 点击 Deploy 即可发布项目。

如果遇到 Icon 图标无法加载的情况,去 Vercel Project > Deployments > Redeploy 重启你现在的项目环境,并取消勾选 checkuse existing build cache

Vercel-Icon问题

在Vercel中添加自定义域名

当你发现点击进去后,无论等待多久,似乎都无法加载出来,这是因为 Vercel 的域名遭到了 DNS污染 ,无法直接访问。如果你想要你的网站能够正常访问的话。还是需要购买域名

  1. Vercel 的项目设置中,找到 Settings 中的 Domain 设置。
  2. 输入购买的域名,按照提示完成域名绑定。

验证域名所有权

Vercel 会提示你添加 DNS记录 以验证域名所有权,若没有添加,则会显示 Invalid Configuration 信息,要求你在 DNS 服务提供商中添加 A记录CNAME记录

  • A记录(Address Record):将域名直接映射到IPv4地址;当用户访问某个域名时,DNS服务器通过A记录返回对应的IP地址,以便浏览器能够连接到正确的服务器。
  • CNAME记录(Canonical Name Record):将域名映射到另一个域名(别名),而不是直接映射到IP地址;常用于将多个域名指向同一个服务器,简化管理。例如,将www.example.com指向example.com。

添加 A记录CNAME记录 的操作需要等 CloudFlare 提供的的 DNS服务器 覆盖完成后执行。

CloudFlare 中添加 A记录CNAME记录 时,需要在 SSL/TLS 配置开启 https加密,选择 完全加密

Vercel 提供自动到 CloudFlare 中添加 A记录CNAME记录 的功能。

添加完成之后,回到 Vercel 点击 Refresh ,发现 A记录CNAME记录 已经添加有效。

Vercel域名在国内被墙

vercel.app 因为被大量使用,自然而然被墙掉了,不过好在 Vercel 官方提供了单独的 IPCNAME地址 给大家,对于国内的用户来说,配置一下单独的解析,依然可以享受 Vercel 提供的服务。

将上述步骤中用到的 IPCNAME地址 替换成以下内容即可:

  • A记录 地址:76.223.126.8876.76.21.98
  • CNAME记录 地址:cname-china.vercel-dns.com