hexo next及github配置
背景
之前博客许久未打理,本地的node环境和hexo版本也比较陈旧,删除了github旧仓库重新跑了一遍,做下记录以便日后参考
参考文档
流程
安装hexo及项目初始化
1
2
3$: npm install -g hexo-cli # 安装hexo
$: hexo init my_project # 初始化项目项目配置
安装next主题
此处使用git方式下载的包在生成静态文件时index.html中包含模板标签,访问有问题,暂时没找到原因,所以使用了npm方式安装:
1
2
3$: cd my_project && npm install hexo-theme-next # 安装next主题
$: cp -rp node_modules/hexo-theme-next themes/next # 此处将npm包拷贝到项目的themes目录,方便主题配置文件的版本管理
$: npm uninstall hexo-theme-next启用next主题
1
2
3
4
5# 项目的_config.yml
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next主题自定义配置
第三方插件
- 字数统计 字数统计
- 本地搜索 第三方服务集成
- Disqus评论插件 第三方服务集成
- Waline评论及阅读数统计插件 快速上手
- 根据上面文档指引,创建并且成功部署Vercel,HTML 引入 (客户端)部分不用做
- hexo安装waline扩展并且在主题中进行配置
$:npm install @waline/hexo-next
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53waline:
# New! Whether enable this plugin
enable: true
# Waline server address url, you should set this to your own link
serverURL: https://your-domain.vercel.app # 替换为你自己的域名
# Waline library CDN url, you can set this to your preferred CDN
libUrl: https://unpkg.com/@waline/client@v2/dist/waline.js
# Waline CSS styles CDN url, you can set this to your preferred CDN
cssUrl: https://unpkg.com/@waline/client@v2/dist/waline.css
# Custom locales
# locale:
# placeholder: Welcome to comment # Comment box placeholder
# If false, comment count will only be displayed in post page, not in home page
commentCount: true # 开启评论数展示
# Pageviews count, Note: You should not enable both `waline.pageview` and `leancloud_visitors`.
pageview: true # 开启阅读数展示
# Custom emoji
emoji:
# - https://unpkg.com/@waline/[email protected]/weibo
# - https://unpkg.com/@waline/[email protected]/alus
- https://unpkg.com/@waline/[email protected]/bilibili
- https://unpkg.com/@waline/[email protected]/qq
# - https://unpkg.com/@waline/[email protected]/tieba
# - https://unpkg.com/@waline/[email protected]/tw-emoji
# Comment infomation, valid meta are nick, mail and link
# meta:
# - nick
# - mail
# - link
# Set required meta field, e.g.: [nick] | [nick, mail]
# requiredMeta:
# - nick
# Language, available values: en-US, zh-CN, zh-TW, pt-BR, ru-RU, jp-JP
lang: zh-CN
# Word limit, no limit when setting to 0
# wordLimit: 0
# Whether enable login, can choose from 'enable', 'disable' and 'force'
# login: enable
# comment per page
pageSize: 10 - 开启了pageview的话需要在leancloud应用的结构化数据中创建
Counter
这个Class,本质上阅读数存储在Counter
表中,评论数据存储在Comment
表中
leancloud阅读次数(Waline可以做)此路不通,不管是国内还国外的云函数部署都需要绑定独立的域名才能使用,暂时没有多余的域名
增加标签页面和分类页面
这样可以在主题的menu配置中加上这两个页面,不然
public/tags
和public/categories
文件夹不会生成index.html
github-page配置
Github Page项目部署配置
Hexo一键部署git hook配置
关联到github-page后,仓库源文件在master分支,public静态资源在gh-pages分支,增加hook可以更加方便的维护源文件和部署静态文件:
- 新增或修改项目下的hook文件
.git/hook/pre-push
1
2
3
4
5
6
7
8
branch="$(git rev-parse --symbolic --abbrev-ref $(git symbolic-ref HEAD))"
if [ "$branch" = "master" ]
then
echo "---- start deploy -----"
/usr/local/bin/hexo g -d # 此处修改为本地hexo的执行路径
fi
exit 0 - 增加可执行的文件权限
1
$: chmod +x .git/hook/pre-push
这样配置之后,新增的md格式文章在master分支编辑完成直接commit+push,会自动生成静态页面并且部署至远程服务器,不需要额外的操作,也保证了仓库的源文件与静态文件版本的一致
- 新增或修改项目下的hook文件