Hugo搭建个人博客 (二)

1,212 阅读4分钟

版权声明:文章首发于 super-geeker.github.io/post/termux… 转载请务必在文章开头醒目位置以超链接形式注明原文链接

在上一篇 Hugo搭建个人博客 (一) 中,主要讲了如何使用Hugo搭建一个本地的个人博客,但这并不能达到我们预期的目标。因此,在这一篇我将继续教大家掌握个人博客完整的线上部署及管理流程。

简介

GitHub

GitHub是一个面向开源及私有软件项目的托管平台,只支持Git作为唯一的版本库格式进行托管。其长期以来,一直推动着技术的快速发展。

GitHub Pages

GitHub Pages是GitHub提供的一项Pages服务,我们这里要讲的线上部署方式就是依托Pages的静态网页托管服务来托管我们的博客。最主要的是,免费!

部署

注册账号

首先我们需要在 GitHub 上注册一个账号,GitHub注册时的username是部署完博客访问地址的一部分,所以尽量起一个合适的名称。

新建仓库

这里我们需要创建两个仓库,一个用于托管我们整个博客项目,仓库名称任取,例如:blog,另一个则用来部署我们的博客,这里需要注意的是,该仓库名称需要命名为:username.github.io,其中,username需替换为自己注册填写的username。例如:

GitHub注册的username为demo
仓库名需命名为:demo.github.io
部署完博客主页访问地址为:demo.github.io

clone到本地

git clone https://github.com/username/blog.git

其中username替换为自己注册时的username,blog替换为自己创建的第一个仓库名称。

合并

将本地已有的博客项目目录中所有文件拷贝到clone下来的项目中。例如:

已有博客项目名:myblog
clone项目名:blog
cp -r myblog/* blog/

重新添加theme

进入项目根目录,删除之前已添加的theme,使用如下命令重新将主题作为submodule添加。

rm -rf themes/主题名
git submodule add https://主题地址 themes/主题名

第一步是删除已添加过的主题,将主题名替换为已添加的主题名。
第二步是重新添加主题作为submodule,将主题地址和主题名分别替换为要添加主题的地址和名称。

配置主题

具体配置方式见上一篇
另外,还需修改项目根目录config.toml文件中baseurl属性,将值替换为username.github.iousername仍是注册时username。

测试运行

hugo server

测试开启服务器后浏览器是否能够正常显示。

生成public目录

hugo

执行hugo server并不会生成public目录。这里需要执行hugo命令。在执行hugo之前,已有博客中的draft属性需要设置为false或删除该属性。
public即为我们要部署的目录。

部署public

cd public
git init
git add .
git commit -m "first commit"
git remote add origin https://github.com/username/username.github.io.git
git push -u origin master

git init只需第一次执行,用于初始化为一个git管理的项目。
git commit后面双引号中是自定义的提交信息。
git remote中的username替换为注册时的username。
最后一句只有第一次push需要加-u参数。
根据提示输入GitHub的用户名和密码即可。

public作为submodule

cd ..
rm -rf public
git submodule add https://github.com/username/username.github.io.git public

回到项目根目录,删除已生成的public目录。
将刚部署到线上的项目作为submodule重新添加,username替换为注册的username。

添加脚本

  • 新建deploy.sh

    vim deploy.sh
    
  • 编辑内容

    #!/bin/sh
    
    set -e
    
    printf "\033[0;32mDeploying updates to Github...\033[0m\n"
    
    hugo
    
    cd public
    
    git add .
    
    msg="rebuilding site $(date)"
    if [ -n "$*" ]; then
    	msg="$*"
    fi
    
    git commit -m "$msg"
    
    git push origin master
    
  • 保存退出

  • 赋予可执行权限

    chmod +x deploy.sh
    

    之后部署public目录,只需在项目根目录执行./deploy.sh "提交信息"即可。

提交整个博客项目

git add .
git commit -m "first commit"
git push origin master

因为我们的博客项目是clone下来的,所以commit之后只需执行push即可。
这里也可根据需要将整个博客项目的提交加入脚本一同或分开管理。

小结

至此,博客完整的部署及管理流程就完成了。之后的维护可分为如下几个步骤:

  • 编写博客

  • 本地调试,执行hugo server

  • 生成public,执行hugo

  • 执行脚本,执行./deploy.sh "提交信息"

  • 提交整个博客项目