Tian Jiale's Blog

Vercel 使用之部署博客

Vercel 是什么

如果你曾听说过 ZEIT Now，是的，它是 Vercel 的前身。在去年早些时候，ZEIT Now 进行了「品牌升级」，成为了现在的 Vercel。

注册与安装

首先，在 Vercel 官网注册一个新账户。现在，注册新用户必须使用 Github、Gitlab 或者 Bitbucket 的账户进行授权，并绑定手机号。注册完成后，可以在配置页面修改自己的邮箱地址。

Vercel 的大部分功能都通过命令行来操作。Vercel 的客户端工具下载地址。

这个命令行工具是使用 Node.js 编写的，因此使用 npm 安装，也因此同时支持 Windows、macOS 和 Linux 操作系统。如果你没有安装过 Node.js 环境，需要先安装 Node.js。之后，可以在 Windows 的 Powershell 或者 macOS 的终端中运行下述命令安装 Vercel：

npm i -g vercel

成功安装后，运行下述命令登录账户：

vc login

这里，vc 是 Vercel 的缩写，你也可以使用完整版的 vercel 来执行。

Vercel 的登录很有意思，因为我们自始至终没有设置过账户密码，它是通过向你邮箱发送一封邮件确认。在邮件中，甚至还有一个和你约定的「暗号」，作为彼此的凭证。

绑定域名

如果你拥有你自己的域名，或者你拥有多个域名，我十分推荐把它们全部绑定到 Vercel 进行管理。

把域名绑定到 Vercel 时，只需要执行：

vc domains add 域名

然后在你的域名解析服务商处添加解析即可。

hexo + vercel 搭建博客

如果你喜爱写作、喜爱分享，那你一定想过要有一个自己的博客。除了使用类似新浪博客、CSDN 等博客服务之外，许多人也会尝试自己搭建一个「独立博客」。

我以知名的静态博客系统 Hexo 为例。使用 Hexo 写作后，执行 hexo 的命令生成网站的静态文件：

hexo g

这时，会产生一个 public 的文件夹。

继续执行 Vercel 的命令：

vc

是的，这次不需要跟其他命令，只需要简单的 vc 即可。

接下来会出现交互式的配置菜单，需要你依次选择：

Vercel CLI 19.2.0
? Set up and deploy “~/Documents/workspace/blog”? [Y/n] y
? Which scope do you want to deploy to? sanko.sspai
? Link to existing project? [y/N] n
? What’s your project’s name? blog
? In which directory is your code located? ./public
? Want to override the settings? [y/N] n

在第一次部署时，只有倒数第二个问题「In which directory is your code located?」要手动输入 public ，其他问题全部可以直接敲击回车键选择默认配置。

现在，网站已经成功运行起来了。你可以直接去浏览器按下「Ctrl+V」粘贴，即可访问你的新博客。

值得注意的是，这个网站支持 HTTPS 访问。Vercel 会自动为我们申请一个 Let’s Encrypt 的证书，并为我们自动续期。而如果这一切由我们自己来完成，则需要：

  1. 购买域名
  2. 购买服务器
  3. 安装与配置 Nginx
  4. 上传网站文件
  5. 添加 DNS 解析项
  6. 配置 Let’s Encrypt 的证书
  7. 每三个月续期证书

相比之下，使用 Vercel 确实省心不少，还省下了购买域名和服务器的费用。

要更新文章的时候，只需要执行：

vc --prod

文章就会更新到之前的网址中。

hexo + github + vercel 搭建博客

和上面的方式不同的是该方案需要用到 GitHub 来管理我们的网站源码，同时不再需要使用 vercel 工具。

hexo 和 GitHub 的使用请见上一篇文章。注：并不需要部署 GitHub 的静态网站。

OK，我们已经过完了上一篇文章，接下来我们就要用 vercel 来部署我们的网站了。

第一步：进入 vercel 的控制台，点击 New Project。

第二步：授权 GitHub 并 Import 上文所设置的 GitHub 仓库。

第三步：选择自己的账户。

第四步： Continue。

第五步：设置相关信息并 Deploy，看不明白默认即可。

第六步：进入项目页点击 Settings -> Domains，然后添加域名，设置域名解析。

然后等一会儿之后，我们访问添加的域名就可以访问到我们的博客了。而且这个项目只需要更改 GitHub 仓库，Vercel 会在仓库变更之后重新加载网站。

更上一层楼

通过上面那一步是不是发现 Vercel 本身就可以为我们编译项目？而且支持的项目种类非常多，所以我们可以直接把各种项目提交到 GitHub 仓库，然后设置 Vercel，这样就不需要本地跑程序去编译工程了。

而且 Vercel 支持可执行程序，除了没有数据库之外这妥妥的完美解决方案啊，又不需要备案，真香！

限制

这么好的事情有没有限制嘞？

当然有，只不过对于个人博客这种小项目，完全不需要担心被限制，据说是每月 100G 流量，当然，短时间大流量肯定是要出问题的。

项目数目有没有限制不清楚，可以去试一下。