本系列由三部分组成:
构建本地服务并将其发布到Github Pages。配置Github Action来实现CI/CD。本文为第二部分。 —— 将搭建的本地博客托管到github。
本方案以Hugo构建的第一个博客为例,但不限于Hugo。所有静态网站都可以使用此解决方案。
需要准备的
github账号发布的本地静态网页文件。根据上一篇文章的结果,执行hugo命令后,会在public/目录下生成整个静态网站。
流程
根据官网介绍,主要步骤大致如下:
创建GithubPages仓库,将仓库拉取到本地,在本地仓库添加静态网页文件,提交到github仓库
动手干
第一步,创建GithubPages仓库
新建一个公共仓库,命名为username.github.io,其中username 指github 帐户名。
GitHub Pages 项目需要遵守username.github.io 的特殊命名格式。如果仓库名和账户名不完全匹配,网站将无法运行,所以一定要保证完全匹配。
image.png
第二步,将仓库拉到本地
在你想要的目录位置,使用以下命令将新创建的远程仓库拉取到本地位置。
git clone https://github.com/username/username.github.io 建议使用github官方提供的客户端进行操作,主要是为了省去维护登录账号的工作。
第三步,添加静态网页文件添加到本地仓库
将hugo生成的public/目录下的所有文件复制到本地仓库。
cp -rf Hugo 项目/public/* xxx.github.io/
git add --全部
git commit -m "Initial commit" 再次建议使用github 客户端完成git 操作。
提交到github仓库
git push -u origin main 提交完成后,打开浏览器访问https://username.github.io,会看到和本地hugo网页一样的效果。
结论
基于这种托管方式,可以将写好的md文章在本地发布到public/目录,然后推送到远程仓库,实现比较简单的网页更新。
【建站系列教程:Hugo + Github Pages + Github Action 博客托管方案详解】相关文章:
2.米颠拜石
3.王羲之临池学书
8.郑板桥轶事十则
用户评论
想在自己电脑上建个本地博客试试 Hugo,然后再放到 GitHub 上共享?这篇文章正好合适!
有6位网友表示赞同!
一直気になって Hugo ,这篇终于有详细的教程了,赶紧学习一下.
有14位网友表示赞同!
GitHub Pages 托管我的博客网站感觉挺方便的,这个方案也应该很棒。
有5位网友表示赞同!
Github Action 听起来很厉害的样子,能把搭建流程自动化?
有17位网友表示赞同!
想了解一下利用 Github Action 自动部署博客是怎么操作的。
有16位网友表示赞同!
Hugo 确实是一个很好的选择,希望这篇文章详细介绍每一个步骤。
有19位网友表示赞同!
之前尝试过一些其他博客平台,最终还是觉得 GitHub Pages 最合适,稳定又简单.
有20位网友表示赞同!
搭建博客我从来都是很畏惧的,这次看看能不能用这个方案轻松搞定!
有9位网友表示赞同!
希望这篇教程能讲清楚每个细节,这样小白也能顺利搭建完成。
有9位网友表示赞同!
这个方案是不是比传统的建站方案更简单呢?
有17位网友表示赞同!
GitHub 页面上有很多优秀博客,感觉自己也可以尝试一下.
有17位网友表示赞同!
学习一个新的技能总是很有成就感,这次就来试试 Hugo 吧!
有9位网友表示赞同!
我之前搭建过WordPress博客,这个 Hugo 和 WordPress 的区别大吗?
有17位网友表示赞同!
Hugo 构建速度很快吗?比其他博客系统更快?
有19位网友表示赞同!
学习一些新的工具和技术总是好主意,这次就从 GitHub Action 开始吧!
有7位网友表示赞同!
看到这篇文章我有了很大的启发,决定来尝试一下这个方案。
有12位网友表示赞同!
希望这篇文章能详细介绍使用 Github Action 的步骤,方便新手参考。
有16位网友表示赞同!
分享一篇关于 Hugo 的文章,希望能帮助更多人了解这个强大的博客系统。
有18位网友表示赞同!