hwame / hwame.github.io

基于Hexo的静态博客

Home Page:https://hwame.top

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

仓库说明

Watchers stars forks contributors commits

Stargazers

该 Repository 用于个人静态博客的存储,由 Hexo 生成、 Github 托管。

鴻塵

以下简要介绍博客搭建的主要流程以及注意事项,详细搭建步骤可以参考如下文章(都是我自己一个一个字写的),点击上方图片直达【我的博客

博客搭建

此部分自行参考上面的四篇文章。

①准备工作

  • 安装Node.jsGitHexo
  • 创建Github仓库,名称格式必须为<username>.github.io注意: 若想创建README.md,不能在此处新建仓库的时候直接勾选「 Initialize this repository with a README 」,因为后续部署的时候会覆盖(删除)掉该文件。
  • 初始化git:
git config --global user.name <username>
git config --global user.email <email>

# 可以用以下两条命令检查是否输入正确
git config user.name
git config user.email
  • 配置SSH密钥:ssh-keygen -t rsa -C <email>,配置完成后可通过ssh -T git@github.com检查是否成功。
  • 博客初始化:
hexo init <blog_name>
cd <blog_name>
npm install
  • 到这一步博客就已初具雏形,运行hexo g && hexo s预览,如果不报错且浏览器能访问 http://localhost:4000 则表示一切正常、喜大普奔。

hexo常用操作

当我们写了新的文章后,需要重新部署,就会用到以下命令,常用的一键三连hexo clean && hexo g && hexo d

注意: hexo d部署之前需要先配置站点的部署信息。

hexo clean                # 删除缓存和已生成的静态文件
hexo generate             # 生成public静态文件,可简写为hexo g
hexo server               # 本地预览,可简写为hexo s
hexo deploy               # 部署到远程仓库,可简写为hexo d
hexo new [layout] "name"  # 生成新的布局、页面、文章
hexo new "My-new-post"    # 省略layout则为发布文章

③站点配置

Hexo配置文件有两个,一个是称之为 「站点配置文件」./_config.yml,一个是称之为 「主题配置文件」./themes/pure/_config.yml

站点配置没有需要特别注意的地方,参考默认配置并结合《Hexo博客搭建(1)——建站及部署》、《Hexo博客搭建(2)——站点配置》以及 官方文档——配置 等即可。

④主题配置

主题配置主要修改 「主题配置文件」./themes/pure/_config.yml,可根据默认配置按需修改,具体参考Hexo博客搭建(2)——主题配置

此部分在「主题配置文件」中配置了Valine评论系统的全局设置,由于pure主题已集成了disqusyouyanliveregitmentgitalkvaline等多种评论系统,但其中有的已经失效,有的不够稳定,有的需要注册才能评论,因此综合比较下选择了Valine

评论配置的细节见Hexo博客搭建(3)——优化评论系统

⑤评论系统

评论系统需要先在「主题配置文件」中启用并做全局设置(见上),然后才能结合LeanCloud控制台设置使配置生效。

说明: ①推荐选择国际版,因为免费提供了一个二级域名,用于评论后台管理、设置自动唤醒;官方文档可参考帮助信息中文官方文档

  • 部署valine-admin。 首先创建应用、部署项目,然后设置域名白名单和 环境变量 ,配置完成后重新部署项目,最后将后台评论管理系统初始化即可。
  • 防止服务器休眠。 此处的设置主要是为了解决LeanCloud流控问题制定服务器休眠策略,主要包括两个方面:云引擎定时任务实现邮件漏发检查;云服务器利用crontab实现自动唤醒从而防止实例休眠。
  • [可选] 评论系统设置必填项。 此处需要修改源码,实现或解决 meta必填字段通过QQ邮箱获取头像昵称长度 等问题。
  • [可选] 添加身份标签。 此处需要修改源码,实现自定义 博主小伙伴访客 的标签。
  • [可选] 美化评论区样式。 此处需要CSS样式文件./themes/pure/source/css/style.css,实现 评论框背景及隐藏评论及回复添加边框头像悬停旋转 等功能。

⑥修修补补

这部分内容主要对博客做最后的完善,所有的修修补补都可以在Hexo博客搭建(4)——常见问题中找到答案。 主要包括以下三个方面:

注意事项

①Gitee同步

  • 【迁移同步】由于众所周知的原因,不论是Github网页/API还是jsdelivrCDN, 都经常会挂掉导致无法访问,因此在 Gitee-hwame 上导入了该项目 Gitee-hwame/blog 并且设置了自动同步,后续考虑使用 GiteePages
  • 【图床修改】Gitee图床仓库不允许设置为「公开」,故未导入 Github图床hwame/pics ,后续会将 【博客图片及资源】迁移到博客目录下,且不再使用 jsdelivrCDN 加速Github静态资源
  • 【提交部署】Github与Gitee配置的邮箱不一致,提交代码有可能出问题,采取如下两种措施:
    • (1) Gitee自动同步 Github-hwame/hwame.github.io 仓库,部署时直接提交到GitHub即可
    • (2) Gitee代码提交方式配置svn,自动同步若有延时,可直接通过svn提交
  • 【资源加速】若后续使用 GiteePages 而停用 GithubPages,可能会导致图片加载慢的问题,后续再考虑【 图片压缩 】、【 魔改Fancy Box 】等优化方式进行 静态资源加速

②添加README

由于Hexo渲染引擎的原因,README.md将被解析为README.html,将其放在./source/目录下(与CNAME一致)。同时修改 站点配置文件 ./_config.yml

# Directory
skip_render: README.md

②添加LICENSE

项目使用 MIT 许可协议,文件添加方式基本与上文 添加README 相同,只需要将 LICENSE 文件放在 ./source/ 目录下(与 CNAME 一致)即可,无需修改站点配置文件。

About

基于Hexo的静态博客

https://hwame.top

License:MIT License


Languages

Language:HTML 93.5%Language:JavaScript 3.6%Language:CSS 2.9%