利用hexo + github pages构建个人博客技术总结


博客介绍

通过利用hexo + github pages快速搭建起一个静态的个人博客网站。选用Hexo框架是因为这个框架网上教程比较多,操作比较简单,只需要几条命令就可以完成博客页面的编译渲染,并快速部署到github上去。同时hexo框架基于node.js进行开发,使用npm下载需要的模块很方便。

博客主要页面展示

主题是在Hexo的网站上挑选的一个网友开源出来的主题模板

选择这个模板是因为这个模板布局简单,主要面分为两部分,左边是发布的文章列表,右边是一些个人信息和标签。同时专门写了一个个人信息页面,可以通过博客页面的顶部导航栏进行跳转,其实就是一个md文件,通过修改config文件的路由配置实现点击跳转到这个md文件里面。主要技术这里不详细介绍。

image-20240420152031680
文章归档
image-20240420152053421

遇到的一些问题

Hexo是一个很方便的工具,只需通过几个命令就可以构建网站并快速上传GitHub

具体教程链接:https://zhuanlan.zhihu.com/p/60578464

配置github的ssh密钥

因为网站是要部署在GitHub上,所以要把编译好的网站上传到github仓库,需要在项目里配置ssh密钥,虽然也可以使用http协议进行上传。按照网上教程在本地生成ssh公钥之后,把公钥添加到github中之后,在进行上传的时候还是报错。经过网上查资料,可能是因为windows文件权限问题,访问不到C盘中的配置文件,对路径进行配置即可解决。

ssh-keyscan -t rsa github.com >> ~/.ssh/known_hosts

参考:git 配置 SSH密钥,解决失败问题_无法验证您的 ssh 密钥: sshkeygenparsepublickey: fail to pa-CSDN博客

github仓库提交代码审查不过

在GitHub的项目仓库里,在push代码的时候会进行一些安全性检测,如果有泄露风险,会push不上去,需要在setting把这个安全机制关掉

上传github报错

配置github图床

在写markdown文件时候需要贴一些图片,但是在一般的md编译器里,可能是直接使用图片的本地链接,这要的话网站在部署上线的时候是显示不出图片的。我们可以配置一个个人的图床,利用github就可以实现,把图片上传到github仓库,可以得到一个图片链接,通过网络就可以访问图片,具体做法这里不具体介绍,网上教程很多。如果使用的Typora,则可以很方便在“偏好设置”完成,同时完成github仓库配置即可。

更改主题和主题的页面的配置

在hexo框架中,要更改某些配置只需要更改_config.yml文件中的配置项即可,尽量不要去更改他的js源代码。包括一些页面的页面顶部统一配置,背景图片,页脚的统一配置,都可以在config文件里面进行配置。这样的2好处就是修改很方便,但是不同做一些很个性化的修改,只能按照模板的默认设定,如果要进行深度的定制化需要去更改主题的js文件,这是非常麻烦和费力的。

总结

通过这次作业接触到了hexo+github快速上线个人博客的技术,还是学到很多东西。也非常有趣,可惜没有更多的时间去探索更深入的技术细节。未来有可能还会继续完善现在的个人博客,开发一些自己的功能。