关于写博客
2018 年我在 GitHub 上看到强哥的博客,当时为之心动然后 Fork 了那个 repository。后来搬砖沦为社会人就断更了,在工作之后看到奥哥的博客,在他的安利之下,把之前的 Jekyll 的博客换成如今的 Hexo-NexT,打算记录下工作的点滴,学习的心得。一是分享,二是方便自己回顾和查阅。
更新历史
2020 年 09 月 09 日 - 增加使用子文件夹管理 Hexo 文章且不改变文章永久链接
GitHub
如果没有 GitHub 账号,需要去官网 https://github.com/ 注册一个账号。账号注册好之后,需要创建一个 repository,名称格式为 xxx.github.io 例如我的 GitHub 名称为 fainyang, 浏览器显示的 URL 为 https://github.com/fainyang 那么我新建的 repository 就是 fainyang.github.io
申请完账号,创建了 repository 之后,下一步就是在自己的电脑上安装 Hexo。
Hexo
Hexo——快速、简洁且高效的博客框架。官网 https://hexo.io/zh-cn/ 文档还有视频讲解如何安装
安装前提
在安装 Hexo 之前,需要安装 Git 与 Node.js 请参考 这里
开始安装
1 | npm install hexo-cli -g |
新建完成后,指定文件夹的目录如下:1
2
3
4
5
6
7
8.
├── _config.yml #站点配置文件,主要就是修改这个文件
├── package.json
├── scaffolds #模板文件夹
├── source #存放文章,图片的文件夹
| ├── _drafts
| └── _posts
└── themes #主题文件夹,等会下载 NexT 主题
这是我的 _config.yml 配置
1 | # Hexo Configuration |
Hexo 常用命令
官网详细的介绍 https://hexo.io/zh-cn/docs/commands
1 | 命令缩写 |
本地运行网站
1 | hexo s # 当前路径要在之前创建的 hexo init <folder> 这个 <folder> 下 |
在浏览器输入 http://localhost:4000
就可以看到初始的网站
_post subfolder
_config.yml 里 permalinks 不用 :title 而用 :name 就好了(:name 就指代文件名本身)
为什么这样做,是因为我在 _post 下面新建了几个folder, 用年份来命名的文件夹1
permalink: post/:name/
NexT
Elegant Theme for Hexo——精于心,简于形。 官网 http://theme-next.iissnan.com/
安装 Next
1 | 当前路径要在之前创建的 hexo init <folder> 这个 <folder> 下 |
git clone 完成后,指定文件夹的目录如下:1
2
3
4
5
6
7
8
9
10
11.
├── _config.yml #站点配置文件,主要就是修改这个文件
├── package.json
├── scaffolds #模板文件夹
├── source #存放文章,图片的文件夹
| ├── _drafts
| └── _posts
└── themes #主题文件夹,等会下载 NexT 主题
├── landscape
└── next
└── _config.yml #主题配置文件,修改博客主题样式等
主题配置文件 _config.yml
1 | # 菜单显示项 |
此时可以在本地预览一下运行命令 hexo s
部署到 GitHub
部署前,需要修改配置文件里面的 git 地址1
2
3
4
5deploy:
type: git
repo: https://github.com/yourname/yourname.github.io.git #部署上传的地址,需要修改为自己的
branch: master
message: new hexo_blog
修改好 _config.yml 里的 deploy 模块后,就可以开始进行部署,上传到 GitHub1
2
3
4npm install hexo-deployer-git --save
hexo clean
hexo generate
hexo deploy
第一次部署需要输入自己的 GitHub 账号和密码。后面更新部署时就不需要再次输入密码了。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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188feiy-mac:fainyang.github.io feiy$ hexo clean #清除缓存
INFO Deleted database.
INFO Deleted public folder.
feiy-mac:fainyang.github.io feiy$ hexo generate #生成文件
INFO Start processing
INFO Files loaded in 902 ms
INFO Generated: sitemap.xml
INFO Generated: atom.xml
INFO Generated: index.html
INFO Generated: tags/index.html
INFO Generated: categories/index.html
INFO Generated: archives/index.html
INFO Generated: about/index.html
INFO Generated: img/combination1.png
INFO Generated: images/algolia_logo.svg
INFO Generated: img/combination2.png
INFO Generated: img/404-southpark.jpg
INFO Generated: img/favicon.ico
INFO Generated: img/gay.jpeg
INFO Generated: images/apple-touch-icon-next.png
INFO Generated: img/old_driver.jpg
INFO Generated: img/qq-qrcode.png
INFO Generated: img/zjxc.jpg
INFO Generated: images/cc-by-nc-nd.svg
INFO Generated: images/avatar.gif
INFO Generated: images/cc-by-nc-sa.svg
INFO Generated: images/cc-by-nc.svg
INFO Generated: images/cc-by-sa.svg
INFO Generated: images/cc-by-nd.svg
INFO Generated: images/cc-by.svg
INFO Generated: images/favicon.ico
INFO Generated: images/quote-l.svg
INFO Generated: images/cc-zero.svg
INFO Generated: images/loading.gif
INFO Generated: images/logo.svg
INFO Generated: images/searchicon.png
INFO Generated: images/favicon-16x16-next.png
INFO Generated: images/placeholder.gif
INFO Generated: images/favicon-32x32-next.png
INFO Generated: images/quote-r.svg
INFO Generated: images/feiy.gif
INFO Generated: archives/2019/03/index.html
INFO Generated: archives/2018/02/index.html
INFO Generated: post/hexo-blog/index.html
INFO Generated: img/work/6.jpg
INFO Generated: archives/2018/08/index.html
INFO Generated: categories/学习/index.html
INFO Generated: archives/2018/11/index.html
INFO Generated: archives/2018/07/index.html
INFO Generated: img/robot/run.png
INFO Generated: tags/python/index.html
INFO Generated: categories/生活/index.html
INFO Generated: tags/hexo/index.html
INFO Generated: tags/工作/index.html
INFO Generated: archives/2018/04/index.html
INFO Generated: archives/2018/03/index.html
INFO Generated: tags/links/index.html
INFO Generated: post/Canteen/index.html
INFO Generated: tags/NUS/index.html
INFO Generated: img/2019/github.png
INFO Generated: post/Onboarding/index.html
INFO Generated: post/Combination/index.html
INFO Generated: post/Robot/index.html
INFO Generated: post/blog/index.html
INFO Generated: post/Master/index.html
INFO Generated: post/links/index.html
INFO Generated: post/timestampdiff/index.html
INFO Generated: img/time3.png
INFO Generated: img/start.jpg
INFO Generated: img/robot/tencent.png
INFO Generated: img/work/8.JPG
INFO Generated: img/work/7.JPG
INFO Generated: img/avatar-icon.jpg
INFO Generated: img/time1.png
INFO Generated: img/wx-qrcode.png
INFO Generated: archives/2018/index.html
INFO Generated: archives/2019/index.html
INFO Generated: img/146228364162795.jpg
INFO Generated: lib/font-awesome/HELP-US-OUT.txt
INFO Generated: css/main.css
INFO Generated: img/canteen/bird.jpg
INFO Generated: img/combination3.png
INFO Generated: img/time4.png
INFO Generated: img/path.jpg
INFO Generated: img/time2.png
INFO Generated: img/work/10.JPG
INFO Generated: img/work/5.JPG
INFO Generated: img/work/13.JPG
INFO Generated: img/work/2.JPG
INFO Generated: img/work/1.JPG
INFO Generated: lib/font-awesome/bower.json
INFO Generated: img/robot/ditou.jpg
INFO Generated: img/canteen/contact.png
INFO Generated: img/robot/happy.jpg
INFO Generated: img/robot/poor.jpeg
INFO Generated: img/robot/miaohui.jpg
INFO Generated: img/robot/qidai.jpeg
INFO Generated: img/robot/python.png
INFO Generated: img/robot/tuling.png
INFO Generated: img/canteen/B.png
INFO Generated: img/robot/dalao.png
INFO Generated: lib/velocity/velocity.ui.min.js
INFO Generated: lib/font-awesome/fonts/fontawesome-webfont.woff2
INFO Generated: img/robot/result3.jpeg
INFO Generated: img/canteen/F-319.png
INFO Generated: img/canteen/F-320.png
INFO Generated: img/robot/result1.jpeg
INFO Generated: img/work/9.JPG
INFO Generated: img/canteen/wen.png
INFO Generated: lib/font-awesome/fonts/fontawesome-webfont.woff
INFO Generated: img/canteen/E1.png
INFO Generated: lib/velocity/velocity.ui.js
INFO Generated: lib/velocity/velocity.min.js
INFO Generated: img/canteen/E-322.png
INFO Generated: img/canteen/F-321.png
INFO Generated: img/canteen/F-322.png
INFO Generated: img/canteen/F-323.png
INFO Generated: img/canteen/Y-320.png
INFO Generated: img/canteen/Y-321.png
INFO Generated: img/canteen/Y-322.png
INFO Generated: img/work/12.JPG
INFO Generated: img/robot/result2.jpeg
INFO Generated: img/work/4.JPG
INFO Generated: img/canteen/E-319.png
INFO Generated: js/src/algolia-search.js
INFO Generated: lib/font-awesome/css/font-awesome.css.map
INFO Generated: img/issue.png
INFO Generated: img/combination4.png
INFO Generated: img/canteen/E-323.png
INFO Generated: img/work/3.JPG
INFO Generated: img/canteen/Y-319.png
INFO Generated: img/canteen/table.png
INFO Generated: img/work/11.JPG
INFO Generated: img/work/15.JPG
INFO Generated: js/src/affix.js
INFO Generated: js/src/exturl.js
INFO Generated: js/src/next-boot.js
INFO Generated: js/src/scrollspy.js
INFO Generated: js/src/js.cookie.js
INFO Generated: js/src/post-details.js
INFO Generated: js/src/scroll-cookie.js
INFO Generated: lib/font-awesome/fonts/fontawesome-webfont.eot
INFO Generated: img/canteen/Y-323.png
INFO Generated: img/canteen/E-321.png
INFO Generated: img/canteen/E-320.png
INFO Generated: lib/font-awesome/css/font-awesome.min.css
INFO Generated: lib/font-awesome/css/font-awesome.css
INFO Generated: js/src/motion.js
INFO Generated: js/src/utils.js
INFO Generated: js/src/schemes/pisces.js
INFO Generated: img/work/16.JPG
INFO Generated: js/src/schemes/muse.js
INFO Generated: img/work/14.JPG
INFO Generated: lib/jquery/index.js
INFO Generated: img/install-steps.gif
INFO Generated: lib/velocity/velocity.js
INFO Generated: img/work/17.JPG
INFO Generated: img/work/18.jpg
INFO 152 files generated in 1.86 s
feiy-mac:fainyang.github.io feiy$ hexo deploy #部署到 GitHub
INFO Deploying: git
INFO Clearing .deploy_git folder...
INFO Copying files from public folder...
INFO Copying files from extend dirs...
[master f55c4d1] new hexo_blog
34 files changed, 8859 insertions(+), 150 deletions(-)
create mode 100644 archives/2019/03/index.html
create mode 100644 archives/2019/index.html
create mode 100644 categories/index.html
create mode 100644 categories/学习/index.html
create mode 100644 categories/生活/index.html
create mode 100644 img/2019/github.png
create mode 100644 post/hexo-blog/index.html
create mode 100644 tags/NUS/index.html
create mode 100644 tags/hexo/index.html
rename tags/{life => links}/index.html (87%)
create mode 100644 tags/工作/index.html
Enumerating objects: 114, done.
Counting objects: 100% (114/114), done.
Delta compression using up to 4 threads
Compressing objects: 100% (43/43), done.
Writing objects: 100% (69/69), 97.73 KiB | 3.62 MiB/s, done.
Total 69 (delta 33), reused 0 (delta 0)
remote: Resolving deltas: 100% (33/33), completed with 17 local objects.
To https://github.com/fainyang/fainyang.github.io.git
2b7a9ca..f55c4d1 HEAD -> master
Branch 'master' set up to track remote branch 'master' from 'https://github.com/fainyang/fainyang.github.io.git'.
INFO Deploy done: git
在浏览器输入: yourname.github.io 如果看到博客页面那就大功告成。如果有错误的话,在 GitHub repository Setting 里的 GitHub Pages 可以看到错误信息。
图片管理
奥哥推荐的一个非常好用的图片管理工具 PicGo 图片上传+管理新体验。
picgo 需要用到 GitHub 的 token 最好保存下来,以免要迁移到其他电脑。
github 改名
在 github 改名和换邮箱后,之前很多的 commit 就不属于当前用户,无法显示在 activity 上面。 我们可以通过 git-filter-repo 来修改记录
-
1
pip3 install git-filter-repo
然后是创建文件 mailma , 参考 Git rewrite commit email addresses gitmailmap
1
2
3新名称 新邮箱地址一定带< > 旧名称 旧邮箱地址一定带< >
feiyang233 <feiyangyang233@gmail.com> feiyang <fainyang@foxmail.com>
feiyang233 <feiyangyang233@gmail.com> FEI YANG <fainyang@foxmail.com>下一步就是替换, 然后再更新远程
1
2
3
4
5
6git filter-repo --mailmap mailmap --force
因为替换后, 自动删除了远程,我们需要添加 remot
git remote add origin git@github.com:feiyang233/feiyang233.github.io.git
git push --force
hexo github 改名
首先需要删除文件夹
.deploy_git
, 需要注意的是: 删除这个文件夹后,重新部署,github 上面的 commit 记录会重新初始化。但我认为无所谓啦,我们的 blog 源文件不是这个 repo1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18➜ blog git:(main) ✗ tree . -a -L 1 <aws:default>
.
|-- .DS_Store
|-- .deploy_git
|-- .git
|-- .gitignore
|-- .idea
|-- .vscode
|-- _config.yml
|-- db.json
|-- debug.log
|-- node_modules
|-- package-lock.json
|-- package.json
|-- public
|-- scaffolds
|-- source
`-- themes然后更新
_config.yml
1
2
3
4
5
6
7deploy:
type: git
repo: git@github.com:feiyang233/feiyang233.github.io.git
branch: master
message: update githubid and email
name: feiyang233
email: feiyangyang233@gmail.com还有一种老方法
filter-branch
也是可以的,但官方已经不推荐了。 详情请看 修改Git全部Commit提交记录的用户名Name和邮箱Email
踩过的一些坑
- 在添加标签和分类的时候,当在source下面创建了文件夹的 index.md 这个文件一定要添加相关的 type. 例如 type: “categories”, type: “tags”.
- 添加搜索功能时,一直转圈加载不出来。是因为自己写的文章中存在不可见字符:一个backspace的字符。 详情可以参考: 一 二
- node@14 不兼容 https://github.com/hexojs/hexo-deployer-git/issues/177 三
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$ hexo d
INFO Deploying: git
INFO Clearing .deploy_git folder...
INFO Copying files from public folder...
FATAL Something's wrong. Maybe you can find the solution here: http://hexo.io/docs/troubleshooting.html
TypeError [ERR_INVALID_ARG_TYPE]: The "mode" argument must be integer. Received an instance of Object
at copyFile (fs.js:1890:10)
at tryCatcher (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/util.js:16:23)
at ret (eval at makeNodePromisifiedEval (/usr/local/lib/node_modules/hexo-cli/node_modules/bluebird/js/release/promisify.js:184:12), <anonymous>:13:39)
at /Users/yang.fei/Documents/fainyang.github.io/node_modules/hexo-deployer-git/node_modules/hexo-fs/lib/fs.js:144:39
at tryCatcher (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/util.js:16:23)
at Promise._settlePromiseFromHandler (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:512:31)
at Promise._settlePromise (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:569:18)
at Promise._settlePromise0 (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:614:10)
at Promise._settlePromises (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:694:18)
at Promise._fulfill (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:638:18)
at Promise._resolveCallback (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:432:57)
at Promise._settlePromiseFromHandler (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:524:17)
at Promise._settlePromise (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:569:18)
at Promise._settlePromise0 (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:614:10)
at Promise._settlePromises (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:694:18)
at Promise._fulfill (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:638:18)
at Promise._resolveCallback (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:432:57)
at Promise._settlePromiseFromHandler (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:524:17)
at Promise._settlePromise (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:569:18)
at Promise._settlePromise0 (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:614:10)
at Promise._settlePromises (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:694:18)
at Promise._fulfill (/Users/yang.fei/Documents/fainyang.github.io/node_modules/bluebird/js/release/promise.js:638:18)
#不该升级的 brew upgrade,只能重新安装 node@12
brew install node@12
echo 'export PATH="/usr/local/opt/node@12/bin:$PATH"' >> ~/.bash_profile
source ~/.bash_profile - hexo deploy git user.name 和全局的不一样 https://github.com/hexojs/hexo/issues/2125,
- update hexo https://finisky.github.io/2019/11/24/updatehexo/
- 解决Hexo博客模板hexo-theme-next的翻页按钮不正常显示问题 https://www.cnblogs.com/xiejava/p/12456273.html
- sidebar 出现 archives/%7C%7C%20archive
1
2
3<a href="{{ url_for(theme.menu.archives).split('||')[0] | trim }}">
替换为
<a href="{{ url_for(theme.menu.archives.split('||')[0] | trim) }}">