事情的发展难以预料

看中Zzo主题的搜索、代码样式和目录，英文字体也很好看，狠下心来从简洁风格的MemE跳槽而来。步骤十分傻白甜：没有git submodule，直接把仓库文件下载到本地的博客根目录，然后替换配置文件并做基础改动。Hugo server -D本地预览毫无问题，怎么就，怎么就构建失败了呢？

The path you are accessing was not found in the Build Outputs of your Deployment.If you want to view your Build Outputs directly, you can turn on the Directory Listing.

博客搭建方式是hugo+Vercel，并把源码推送到Github中让其连接Vercel进行自动部署。对于这种本地预览完全没问题，但部署过程出现错误这种情况我毫无头绪，甚至还有一点小崩溃。虽然我留有存档，能一键回滚到前一个版本，但亲眼看见自己的成果功亏一篑多少还是有些难受…（没错我是小白，建博客也就不到一周时间）

修改了博客文件夹的一些内容，试图让他构建成功，无果。把这件事跟皮塔丘说了一下，她为我提供了新的思路：本地渲染，把渲染出的文件推到一个新仓库，用Github Pages发布，也就是Hugo+Github Pages的搭建方式。为了优先拯救404的博客，我先用存档将其回归正常（现在成了堆放随笔的地方），然后准备用新的域名试水（也就是这个博客）。

历史总是惊人的相似

对新仓库打声招呼

在Github中建立两个仓库：可以设为私密的源码仓库（存放你的博客根目录，可以随意命名，例如blog）和需要公开的编译仓库。由于一些原因，如果编译仓库的名字不是username.github.io（username是你的Github用户名）的话，会导致一些问题，比如css样式无法加载，具体来说就是将config.toml的baseURL设置为含子路径的地址，不能正确的处理所有资源的构建位置。想了解更多请看这篇博客。

由于我之前按照这篇博客搭建过博客，所以我进行过git全局配置，且本地存有SSH key，因此略过SSH生成与上传公钥步骤。

Github登录后右上角Settings里找到Developer settings，再点Personal access tokens，Generate new token生成新的token，Select scopes里勾选repo全部内容与workflow，最后点击绿色按钮生成，将生成的Token保存下来。然后使用可视化的git工具：Github Desktop将支离破碎的博客根目录push到源码仓库中（使用代码也可）。进入源码仓库，可以发现本地的文件已经被推送到源码仓库了。

点进源码仓库的Settings中，找到Secrets，点击New repository secret，名称为PERSONAL_TOKEN，内容为之前备份下来的Token。

Github Action是什么能吃吗

源码仓库中点击上方的Actions，set up a workflow yourself，之后你会发现github会在根目录下新建/.github/workflows/xxx.yml文件，下方是这个文件的编辑区域。把下面的配置复制进去，yml文件的名称与配置第一行的name随意填，特别注意我添加注释的地方。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

name: hugo-blog

on:
  push:
    branches:
      - main  # 源码仓库的默认分支，这里是main，有时也是master
  pull_request:

jobs:
  deploy:
    runs-on: ubuntu-20.04
    concurrency:
      group: ${{ github.workflow }}-${{ github.ref }}
    steps:
      - uses: actions/checkout@v2
#         with:               # 如果你安装主题时用的是git submodule add
#           submodules: true  # 那么这三行不必注释掉，这一行填写 true
#           fetch-depth: 0    # Fetch all history for .GitInfo and .Lastmod

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.89.1'  # 填写你的hugo版本，可用hugo version查看
          extended: true          # 如果你使用的不是extended版本的hugo，将true改为false

      - name: Build
        run: hugo --minify

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        if: ${{ github.ref == 'refs/heads/main' }}  # 注意填写main或者master，其他不要动
        with:
          personal_token: ${{ secrets.PERSONAL_TOKEN }} # 如果secret取了其他名称，将PERSONAL_TOKEN替换掉
          external_repository: <username>/<username>.github.io # 填写远程仓库，username是你的github用户名
          publish_dir: ./public
          cname: blog.example.com        # 填写你的自定义域名。如果没有用自定义域名，注释掉这行

以上代码来自Suica！

最后那行填写自定义域名，推荐第一次部署时先注释掉，搭建完成后如果对国内/外访问速度满意的话再填写，这篇文章的最后会讲到。

提交commit，保存，然后可以发现action在尝试运行，绿色代表部署成功。这个时候编译仓库里可以看到自动建了一个名为gh-pages的分支，里面出现了许多东西。如果你没有填写自定义域名，那么username.github.io就是你的博客地址，此时打开你的博客域名应该已经可以看到博客内容。这种搭建方式就是Hugo+Github Action自动部署。

很奇怪的是，如果我参考这个workflow，在部署（deploy）那步会出现奇怪的错误：

error:src refspec main does not match any

因为有deploy的步骤，让我感觉感觉和Vercel的404错误差不多…

如果你有自有域名！

在workflow中添加自有域名

如果你想在源码仓库添加workflow那一步添加自有域名，请参考Suica的自定义域名注意事项。具体来说就是先去config.toml中将baseURL改为你的自有域名，并且为workflow文件中最后注释的一行删掉注释，然后在DNS管理商那里添加一项内容为username.github.io的CNAME记录。最后进入编译仓库settings，pages页面添加自定义域名，勾选github上的强制https按钮。你也可以打开cloudflare的代理，但这样做会无法勾选强制https按钮。

但是，由于github在国内加载速度极慢，如果想获得国内加速，可以加一层cloudflare证书，或者是Vercel(需要自有域名，Vercel分配的域名很丑)。这里推荐后者，将域名交给Vercel保管可以获得两个博客地址，一个是user.github.io（国外访问）一个是自己的域名（国内加速），好处多多。但如果你使用的主题有一些功能旨在重定向到baseURL的话，这样可能会导致一些功能出现故障（多数情况是没问题的），建议仔细检查一下。

请问你要来点国内加速魔法吗

点击Vercel注册页面，选择使用 Github 账号注册，弹出授权窗口时，点击Authorize Vercel，随后跳转到Let’s build something new页面（如果没有，在Dashboard点击 New project），在Import Git Repository下方选择Add github org or account，弹出安装窗口，点击Install。之后再在GIT SCOPE中点击你的 Github 账户，下方的项目选择username.github.io，也就是你的编译仓库，点击skip，输入Vercel项目名（随意），然后deploy，等看到Congratulations和满屏烟花时，你获得了不错的国内加速。

Vercel点进刚刚添加的项目，右上角setting中选择domains，输入你的域名，点击add，然后refresh一下查看应该添加的DNS记录，按要求去DNS提供商那里添加（一般是内容为76.76.21.21的A记录或内容为cname.vercel-dns.com的CNAME记录），最后回到Vercel中refresh一下看到两个蓝色对号就是成功了。记得去config.toml中将baseURL改为你的自有域名，稍等一分钟就可以使用你的域名进行访问了。