hexo+github+zeabur个人博客

title: blog

date: 2024-08-14 11:24:35

categories:

Hexo
blog
教程

tags:

Hexo
教程
keywords: "blog,Hexo,github"
cover: https://s2.loli.net/2024/08/14/xCVrUGEQ1WhSpPs.png

访问个人blog查看详情 https://caokaier.zeabur.app/

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

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

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

bash 复制代码

#验证Node.js、npm、git是否正常安装
node -v
npm -v
git -v

bash 复制代码

#安装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

bash 复制代码

#初始化Hexo项目
hexo init blogfile     #在选定位置执行，会生成blogfile文件项目，拉取可能失败，多执行几次即可
#也可以新建好blogfile文件夹，进入后直接执行   hexo init          尝试几次发现这样拉取成功几率大

bash 复制代码

#我这里出现了一下错误，没有错误的可以忽略直接 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/，已经成功了

bash 复制代码

#安装切换主题，我这里选了Butterfly，一直喜欢这个风格，访问github，可能需要科学上网，不能科学上网的使用steam++加速github，直接复制下面代码也行

bash 复制代码

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

bash 复制代码

#修改项目根目录配置文件_config.yml，别找成主题的_config.yml
#修改主题为
theme: butterfly    #这里使用什么主题就写什么

bash 复制代码

#清理缓存，重新生成静态文件并运行
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/

bash 复制代码

#修改主题内容，不修改的话图片很简约
#访问github上butterfly主题的Docs中文版，看到升级建议

bash 复制代码

為了減少升級主題後帶來的不便，請使用以下方法（建議，可以不做）。

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


作者: Jerry
連結: https://butterfly.js.org/posts/21cfbf15/
來源: Butterfly
著作權歸作者所有。商業轉載請聯繫作者獲得授權，非商業轉載請註明出處。

注意： 不要把主題目錄的 _config.yml 刪掉
注意： 以後只需要在 _config.butterfly.yml 進行配置就行。
如果使用了 _config.butterfly.yml， 配置主題的 _config.yml 將不會有效果。
Hexo會自動合併主題中的 _config.yml 和 _config.butterfly.yml 裏的配置，如果存在同名配置，會使用 _config.butterfly.yml 的配置，其優先度較高。

bash 复制代码

#创建完成后，这里使用了https://sm.ms/，一个免费的在线图床服务
#上传自己的图片，并生成链接，放入_config.butterfly.yml，这里只做演示，修改以下内容

bash 复制代码

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

bash 复制代码

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

bash 复制代码

#推送，首次弹出对话框登录github
hexo deploy
# 或hexo d

bash 复制代码

#最后一步设置公网访问域名，这里使用https://dash.zeabur.com/
#选择后面不带标签的，免费，然后选择github
#第一次使用会配置github，授权后可以看到自己的仓库

bash 复制代码

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

bash 复制代码

#生成免费域名

bash 复制代码

#成功访问，之后可以在本地修改配置文件，逐步精美，然后上传到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/，你将看到一个简易的后台管理界面。