可以使用hexo+github pages直接搭建,这里使用zeabur设置域名访问

安装git、node.js(这里不过多赘述)

Hexo文档以及主题 https://hexo.io/zh-cn/ 注意官方文档很久没更新了

1
2
3
4
#验证Node.js、npm、git是否正常安装
node -v
npm -v
git -v
1
2
3
4
5
6
7
#安装Hexo
npm install -g hexo-cli #国内安装较慢
#修改为使用阿里云镜像源安装
访问 https://npmmirror.com/ 复制代码 即:
npm install -g cnpm --registry=https://registry.npmmirror.com #这个过程可能相对较慢,耐心等待,安装后把npm换成cnpm使用
#安装Hexo
cnpm install -g hexo-cli
1
2
3
#初始化Hexo项目
hexo init blogfile #在选定位置执行,会生成blogfile文件项目,拉取可能失败,多执行几次即可
#也可以新建好blogfile文件夹,进入后直接执行 hexo init 尝试几次发现这样拉取成功几率大
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
#我这里出现了一下错误,没有错误的可以忽略直接 hexo g   并启动服务 hexo s  这里 hexo init 时下载依赖失败    手动下载
#一下是全部过程,耐心查看
beast@gentle-beast MINGW64 /d
$ hexo init blogfile
INFO Cloning hexo-starter https://github.com/hexojs/hexo-starter.git
INFO Install dependencies
warning hexo > warehouse > cuid@2.1.8: Cuid and other k-sortable and non-cryptog
raphic ids (Ulid, ObjectId, KSUID, all UUIDs) are all insecure. Use @paralleldri
ve/cuid2 instead.
warning hexo-renderer-marked > jsdom > abab@2.0.6: Use your platform's native at
ob() and btoa() methods instead
warning hexo-renderer-marked > jsdom > data-urls > abab@2.0.6: Use your platform
's native atob() and btoa() methods instead
warning hexo-renderer-marked > jsdom > domexception@4.0.0: Use your platform's n
ative DOMException instead
warning hexo-renderer-stylus > stylus > glob@7.2.3: Glob versions prior to v9 ar
e no longer supported
warning hexo-renderer-stylus > stylus > glob > inflight@1.0.6: This module is no
t supported, and leaks memory. Do not use it. Check out lru-cache if you want a
good and tested way to coalesce async requests by a key value, which is much mor
e comprehensive and powerful.
WARN Failed to install dependencies. Please run 'npm install' in "D:\blogfile"
folder.
#这里报错依赖
beast@gentle-beast MINGW64 /d
$ cd blogfile/

beast@gentle-beast MINGW64 /d/blogfile
$ ls
_config.landscape.yml node_modules/ scaffolds/ themes/
_config.yml package.json source/
#使用cnpm手动安装
beast@gentle-beast MINGW64 /d/blogfile
$ cnpm install
√ Installed 10 packages on D:\blogfile
√ All packages installed (used 36ms(network 27ms), speed 0B/s, json 0(0B), tarba
ll 0B, manifests cache hit 0, etag hit 0 / miss 0)

#生成静态文件又报错,报错显示highlight.js 模块可能中出现了语法错误
beast@gentle-beast MINGW64 /d/blogfile
$ hexo g
INFO Validating config
INFO Start processing
FATAL Something's wrong. Maybe you can find the solution here: https://hexo.io/d
ocs/troubleshooting.html
D:\blogfile\node_modules\highlight.js\lib\languages\isbl.js:1806
// enum TE
SyntaxError: Unexpected end of input
at wrapSafe (node:internal/modules/cjs/loader:1281:20)
at Module._compile (node:internal/modules/cjs/loader:1321:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1416:10)
at Module.load (node:internal/modules/cjs/loader:1208:32)
at Module._load (node:internal/modules/cjs/loader:1024:12)
at Module.require (node:internal/modules/cjs/loader:1233:19)
at require (node:internal/modules/helpers:179:18)
at Object.<anonymous> (D:\blogfile\node_modules\highlight.js\lib\index.js:88
:31)
at Module._compile (node:internal/modules/cjs/loader:1358:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1416:10)
at Module.load (node:internal/modules/cjs/loader:1208:32)
at Module._load (node:internal/modules/cjs/loader:1024:12)
at Module.require (node:internal/modules/cjs/loader:1233:19)
at require (node:internal/modules/helpers:179:18)
at highlightUtil (D:\blogfile\node_modules\hexo-util\dist\highlight.js:19:16
)
at Hexo.highlightFilter (D:\blogfile\node_modules\hexo\dist\plugins\highligh
t\highlight.js:41:12)
at SyntaxHighlight.exec (D:\blogfile\node_modules\hexo\dist\extend\syntax_hi
ghlight.js:21:24)
at D:\blogfile\node_modules\hexo\dist\plugins\filter\before_post_render\back
tick_code_block.js:49:44
at String.replace (<anonymous>)
at Hexo.backtickCodeBlock (D:\blogfile\node_modules\hexo\dist\plugins\filter
\before_post_render\backtick_code_block.js:11:36)
at Hexo.tryCatcher (D:\blogfile\node_modules\bluebird\js\release\util.js:16:
23)
at Hexo.<anonymous> (D:\blogfile\node_modules\bluebird\js\release\method.js:
15:34)
#更新 Hexo 和相关依赖,重新安装highlight.js
beast@gentle-beast MINGW64 /d/blogfile
$ npm update
npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memo
ry. Do not use it. Check out lru-cache if you want a good and tested way to coal
esce async requests by a key value, which is much more comprehensive and powerfu
l.
npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supporte
d
npm warn deprecated abab@2.0.6: Use your platform's native atob() and btoa() met
hods instead
npm warn deprecated domexception@4.0.0: Use your platform's native DOMException
instead
npm warn deprecated cuid@2.1.8: Cuid and other k-sortable and non-cryptographic
ids (Ulid, ObjectId, KSUID, all UUIDs) are all insecure. Use @paralleldrive/cuid
2 instead.

added 3 packages, removed 1 package, and changed 224 packages in 3m

23 packages are looking for funding
run `npm fund` for details

beast@gentle-beast MINGW64 /d/blogfile
$ npm uninstall highlight.js

up to date in 1s

23 packages are looking for funding
run `npm fund` for details

#使用cnpm重新安装highlight.js
beast@gentle-beast MINGW64 /d/blogfile
$ cnpm install highlight.js
√ Linked 1 latest versions fallback to D:\blogfile\node_modules\.store\node_modu
les
√ Installed 1 packages on D:\blogfile
√ All packages installed (1 packages installed from npm registry, used 7s(networ
k 7s), speed 0B/s, json 0(0B), tarball 0B, manifests cache hit 1, etag hit 1 / m
iss 0)

dependencies:
+ highlight.js ^11.10.0

#清理缓存并使用cnpm重新安装依赖
beast@gentle-beast MINGW64 /d/blogfile
$ cnpm cache clean --force
npm WARN using --force Recommended protections disabled.

beast@gentle-beast MINGW64 /d/blogfile
$ rm -rf node_modules

beast@gentle-beast MINGW64 /d/blogfile
$ cnpm install
√ Linked 208 latest versions fallback to D:\blogfile\node_modules\.store\node_mo
dules
deprecate hexo-renderer-stylus@3.0.1 › stylus@0.62.0 › glob@^7.1.6 Glob versions
prior to v9 are no longer supported
deprecate hexo-renderer-stylus@3.0.1 › stylus@0.62.0 › glob@7.2.3 › inflight@^1.
0.4 This module is not supported, and leaks memory. Do not use it. Check out lru
-cache if you want a good and tested way to coalesce async requests by a key val
ue, which is much more comprehensive and powerful.
deprecate hexo-renderer-marked@6.3.0 › jsdom@20.0.3 › domexception@^4.0.0 Use yo
ur platform's native DOMException instead
deprecate hexo-renderer-marked@6.3.0 › jsdom@20.0.3 › abab@^2.0.6 Use your platf
orm's native atob() and btoa() methods instead
deprecate hexo@7.3.0 › warehouse@5.0.1 › cuid@^2.1.8 Cuid and other k-sortable a
nd non-cryptographic ids (Ulid, ObjectId, KSUID, all UUIDs) are all insecure. Us
e @paralleldrive/cuid2 instead.
√ Run 1 script(s) in 835ms.
√ Installed 11 packages on D:\blogfile
√ All packages installed (220 packages installed from npm registry, used 10s(net
work 10s), speed 553.16KB/s, json 155(1.17MB), tarball 4.36MB, manifests cache h
it 54, etag hit 53 / miss 89)
#cnpm install 命令成功地安装了依赖包,但有一些关于依赖包的警告和弃用提示,不必理会

#成功,莫名其妙ps:有大佬来解释一下吗
beast@gentle-beast MINGW64 /d/blogfile
$ hexo g
INFO Validating config
INFO Start processing
INFO Files loaded in 236 ms
INFO Generated: archives/2024/index.html
INFO Generated: archives/2024/08/index.html
INFO Generated: archives/index.html
INFO Generated: index.html
INFO Generated: fancybox/jquery.fancybox.min.css
INFO Generated: css/style.css
INFO Generated: js/jquery-3.6.4.min.js
INFO Generated: fancybox/jquery.fancybox.min.js
INFO Generated: js/script.js
INFO Generated: css/images/banner.jpg
INFO Generated: 2024/08/13/hello-world/index.html
INFO 11 files generated in 238 ms
#成功启动服务
beast@gentle-beast MINGW64 /d/blogfile
$ hexo s
INFO Validating config
INFO Start processing
INFO Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

#此时访问http://localhost:4000/,已经成功了
1
#安装切换主题,我这里选了Butterfly,一直喜欢这个风格,访问github,可能需要科学上网,不能科学上网的使用steam++加速github,直接复制下面代码也行

image-20240814100937449

1
2
3
4
5
6
7
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly
#这里证书加速有问题的话是因为开了网络加速
#关闭证书验证
git config --global http.sslVerify false

#安装 pug & stylus renderer
npm install hexo-renderer-pug hexo-renderer-stylus
1
2
3
#修改项目根目录配置文件_config.yml,别找成主题的_config.yml
#修改主题为
theme: butterfly #这里使用什么主题就写什么

image-20240814101844005

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
#清理缓存,重新生成静态文件并运行
hexo clean
# 或hexo c 或hexo cl
#这里有报错看下面,少一个组件,官方文档的事
$ hexo cl
INFO Validating config
ERROR Script load failed: themes\butterfly\scripts\filters\post_lazyload.js
Error: Cannot find module 'hexo-util'



beast@gentle-beast MINGW64 /d/blogfile
$ cnpm install hexo-util --save
√ Linked 1 latest versions fallback to D:\blogfile\node_modules\.store\node_modules
√ Installed 1 packages on D:\blogfile
√ All packages installed (used 92ms(network 90ms), speed 0B/s, json 0(0B), tarball 0B, manifests cache hit 1, etag hit 1 / miss
0)

dependencies:
+ hexo-util ^3.3.0


$ hexo cl
INFO Validating config
INFO
===================================================================
##### # # ##### ##### ###### ##### ###### # # #
# # # # # # # # # # # # #
##### # # # # ##### # # ##### # #
# # # # # # # ##### # # #
# # # # # # # # # # # #
##### #### # # ###### # # # ###### #
4.13.0
===================================================================



#然后生成静态文件
hexo generate
# 或hexo g
hexo server
# 或hexo s 访问http://localhost:4000/
1
2
#修改主题内容,不修改的话图片很简约
#访问github上butterfly主题的Docs中文版,看到升级建议

image-20240814103447920

1
2
3
4
5
6
7
8
9
為了減少升級主題後帶來的不便,請使用以下方法(建議,可以不做)。

在 hexo 的根目錄創建一個文件 _config.butterfly.yml,並把主題目錄的 _config.yml 內容複製到 _config.butterfly.yml 去。( 注意: 複製的是主題的 _config.yml ,而不是 hexo 的 _config.yml)


作者: Jerry
連結: https://butterfly.js.org/posts/21cfbf15/
來源: Butterfly
著作權歸作者所有。商業轉載請聯繫作者獲得授權,非商業轉載請註明出處。
1
2
3
4
注意: 不要把主題目錄的 _config.yml 刪掉
注意: 以後只需要在 _config.butterfly.yml 進行配置就行。
如果使用了 _config.butterfly.yml, 配置主題的 _config.yml 將不會有效果。
Hexo會自動合併主題中的 _config.yml 和 _config.butterfly.yml 裏的配置,如果存在同名配置,會使用 _config.butterfly.yml 的配置,其優先度較高。
1
2
#创建完成后,这里使用了https://sm.ms/,一个免费的在线图床服务
#上传自己的图片,并生成链接,放入_config.butterfly.yml,这里只做演示,修改以下内容

image-20240814103928092

1
2
3
4
5
#完成后重新清理缓存,生成静态文件并运行
hexo cl
hexo g
hexo s
#访问http://localhost:4000/查看

image-20240814104331473

1
2
3
4
5
6
7
#推送或部署到GitHub,首先安装部署插件
cnpm install hexo-deployer-git --save
#配置Hexo部署信息,在根目录下的_config.yml,注意缩进,yaml文件对缩进有要求
deploy:
type: 'git'
repository: https://github.com/manong/blogfile.git #这里复制自己在github上创建的仓库连接,创建仓库就不过多赘述了
branch: main

image-20240814102822640

1
2
3
#推送,首次弹出对话框登录github
hexo deploy
# 或hexo d
1
2
3
#最后一步设置公网访问域名,这里使用https://dash.zeabur.com/
#选择后面不带标签的,免费,然后选择github
#第一次使用会配置github,授权后可以看到自己的仓库

image-20240814104728414
image-20240814104810992
image-20240814104847856

1
#选择创建的仓库,部署,下面就成功了

image-20240814104912100

1
#生成免费域名

image-20240814105146923

image-20240814105225393

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#成功访问,之后可以在本地修改配置文件,逐步精美,然后上传到github,github仓库与zeabur关联会自动更新,非常方便
Demo: https://caokaier.zeabur.app/


#补充,以下可以忽略
hexo new [post]: 创建一个新的文章。
hexo g 或 hexo generate: 生成静态文件。
hexo s 或 hexo server: 启动本地服务器,预览网站。
hexo d 或 hexo deploy: 部署网站到远程服务器。

#如果你想要一个更友好的图形界面,可以考虑使用社区开发的插件,比如 hexo-admin。这个插件提供了一个简单的后台管理界面,你可以通过浏览器访问并管理 Hexo 站点的内容。
#安装 Hexo Admin:
#在 Hexo 项目的根目录下安装 hexo-admin:
cnpm install --save hexo-admin
#启动 Hexo 本地服务器:
hexo server
#访问 http://localhost:4000/admin/,你将看到一个简易的后台管理界面。