hugo stack blog 搭建记录

创建仓库

首先在github创建两个仓库，一个用于存储hugo new site创建的workspace，这个设置为private私密；另一个仓库用来存储hugo -D生成的网页文件，设置为公开:

本地获取ssh密钥

终端输入命令：

1
2


git config --global user.email "you@example.com"   #you@example.com替换为你的邮箱
git config --global user.name "Your Name"          #Your Name替换为你的名字并回车 

生成ssh key,在git bash中输入以下命令:
ssh-keygen -t rsa -C "your_email@example.com" 生成的密钥将存储在C:\uers\username\.ssh\路径下打开公钥文件 id_rsa.pub，复制所有内容，在GitHub上打开Setting -> SSH and GPG keys -> add SSH key，将复制的内容粘贴在里边，保存。

若配置完后，还是显示无法连接到github,可能是你的Windows电脑的username 是中文导致的bug 或者尝试在.ssh 下创建一个config 文件

1
2
3
4
5
6


Host github.com
HostName ssh.github.com  # **这是最重要的部分**
User git
Port 443
PreferredAuthentications publickey
IdentityFile ~/.ssh/id_rsa

创建github token

在 GitHub 账户下 Setting - Developer setting - Personal access tokens(classic) 下创建一个不过期(no expiration)的 Token，权限需要开启 repo 与 workflow。

（注意：token只会显示一次，请及时保存）

私密源仓库设置token

在博客源仓库的 Settings->Secrets->Actions 中添加 PERSONAL_TOKEN 环境变量为刚才的 Token,
这样 GitHub Action 就可以获取到Token 了。

本地首次创建博客

1
2
3


hugo new site hugo-stack-blog-dev  
git init  
git submodule add https://github.com/CaiJimmy/hugo-theme-stack/ themes/hugo-theme-stack  

git submodule主要是将自己的改动，与引用的stack主题仓库分开。hugo-theme-stack 下的目录结构基本与站点源目录结构一致 hugo 生成网站时优先寻找站点源目录下的，找不到，才会去stack主题对应目录下寻找
接下来将 exampleSite样例数据中的 Content 和 hugo.yaml 复制到主文件夹中，并删掉hugo.toml
可以hugo server -D看一下初始网站长啥样
创建一篇新文章(在主目录下)

1

hugo new post/blog1/index.zh-cn.md

初始化博客源仓库，提交到github

1
2
3
4
5


git add .  
git commit -m "first commit"  
git branch -M main  
git remote add origin  git@github.com:charles-7777/hugo-stack-blog-dev.git    
git push -u origin main  

创建workflows发布文件

在本地博客主目录下创建 .github/workflows目录，然后创建xxxx.yaml文件。我的 GitHub Action 配置为，自动发布示例配置如下：

 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
37


name: deploy

# 代码提交到main分支时触发github action
on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
        - name: Checkout
          uses: actions/checkout@v2
          with:
            submodules: recursive
            fetch-depth: 0

        - name: Setup Hugo
          uses: peaceiris/actions-hugo@v3
          with:
              hugo-version: "0.147.7"
              extended: true

        - name: Build Web
          run: hugo -D

        - name: Deploy Web
          uses: peaceiris/actions-gh-pages@v4
          with:
              PERSONAL_TOKEN: ${{ secrets.TOKEN }}
              EXTERNAL_REPOSITORY: charles-7777/hugo-stack
              PUBLISH_BRANCH: main
              PUBLISH_DIR: ./public
              commit_message: auto deploy

 

提交github action的改动后，每次push hugo-stack-blog-dev ,就会把基于这个厂库 hugo -D 生成的文件自动push 到仓库 hugo-stack

GitHub Pages

前往hugo-stack 仓库的settings-->Pages去添加deploy GitHub Pages

在别的电脑拉取源仓库修改

1
2
3


git clone git@github.com:charles-7777/hugo-stack-blog-dev.git  
git submodule init
git submodule update

参考链接
https://letere-gzj.github.io/hugo-stack/tags/hugo/
参考博主letere-gzj的视频

markdown中的图片也可以不用本地的图片，可以使用网络url，可以自己创建一个图床，方便管理。 github图床