最近,我使用 GitHub Actions 实现了静态博客的自动化部署,觉得它非常强大,也就是说,只要你提交到 GitHub,后面的部署完全可以通过配置让 GitHub 替你完成,你说方便不方便,持续集成、发布,自动化就靠它了。
接下来,以 GitHub Actions 实现静态博客的自动化部署为例,带你入门 GitHub Actions,如有任何问题,欢迎留言讨论。
很多程序员都有自己的博客,而静态博客是学习成本和部署成本都非常低,也无需担心网站安全问题,可以专心写博客。
所谓静态博客,即通过生成工具(eg:Hexo、Hugo、VuePress 等),直接将作者所书写的博文编译成最终的 html、css、js 等静态文件。作者/博主,只需将生成的文件部署在静态 server 上面即可被在互联网中访问。
一般这类静态博客部署的流程是:
- 写一篇 markdown 文章。
- 执行命令生成静态文件,比如
npm run build
。 - 将静态文件推送到博客仓库,比如说 GitHub、Gitee 或者服务器,如果是 Gitee,还要手动点击重新部署按钮。
- 访问网址验证是否成功
- 为了备份你的博客,你可能要将你写博客的项目也提交到仓库。
博客就是用来写文章的,每次写篇文章还要搞这么多操作,时间长了你一定会觉得很累。
现在,这个问题不存在了,当你使用了 GitHub Actions 之后,流程可以简化为:
- 写一篇 markdown 文章。
- 提交到 GitHub,相当于上面的第 5 步,不需要上传 node_modules 文件夹。
结束了,是不是很方便?
即使自己写博客的电脑不在身边,只要有网络可以将这个写博客的仓库 clone 下,写完 push 一下就可以了,完全不用安装任何脚手架及如黑洞般的 node_modules,让你随时随地的写博客。
从机械的流程中解脱,专注于写作,岂不美哉!那么现在就开始 GitHub Actions 之旅吧。
实现一个小目标
假如有以下四个仓库:
- github/somenzz/push_blog:写博客的项目仓库,里面有用于生成博客的 md 文件,和生成静态博客的脚手架,比如 VuePress,hexo 等,该仓库可以私有。
- github/somenzz/somenzz.github.io:存放博客的静态资源文件,用于 GitHub Pages 展示博客。
- gitee/somenzz/somenzz:存放博客的静态资源文件,用于 GitHub Pages 展示博客。
- xxx.xxx.xxx.xxx: /xxxx/blog/ 自己购买的服务器,用于存放静态博客资源文件。
现在的目标就是,写好一篇文章,向仓库 1 推送之后,仓库 2、3、4 自动更新静态资源文件。当然来,你也可以根据情况,仅跟新 2或仅更新 3,只需要将对应的步骤从 GitHub Actions 配置中注释或删除即可。
理解 GitHub Actions
这里说下对 Github Actions 的理解,GitHub 会有一台虚拟机先将你的项目 clone 过去,然后执行你定义的命令,生成静态文件,然后 push 到你指定的仓库中。这期间就涉及到一些访问权限的控制,都是写在配置文件中的。
现在,我们一步一步来。
首先在仓库 1 的根目录下,创建 .github/workflows/main.yml
文件,这就是 GitHub Actions 功能的配置文件,写入以下内容
网友评论