使用 Hexo 搭建博客的总结
今天用了几分钟搭建了这个基于 Hexo 的个人博客。具体是参考了知乎的建站文章进行一步步操作[1]。可能作者的撰写的时间有点遥远(2019年),有些细节上的差别。现通过这篇博客来说明我的搭建心得。
写在前面
由于我电脑中本来就已经配置好 node.js 和 git 所以,本文中不再赘述。具体需要的前期食材(以下准备环境都是基于我计算机上的配置,随着时间推移,会有更多新的稳定版本上线,基本上会兼容):
- Node.js(v18.17.1)
- Git for Windows(git version 2.42.0.windows.1)
- Hexo 框架
- Github 账号
- 在 GitHub 在上面新建一个 Repository,Repository name 为
GitHub用户名.github.io
配置 Git 账号
打开控制台:右键点击 Windows Logo(下方任务栏的微软图标),找到 Terminal(中译:终端 / 控制台),然后输入配置用户名和邮箱信息:
git config --global user.email "你的 GitHub 注册邮箱" |
这俩信息忘记的话,直接点开 GitHub 去检查,在主页都会显示。主页怎么进去?打开 GitHub 点开右上角头像,点击 Your profile
菜单,就能打开了。个人信息都在那边。
生成 SSH 密钥(这一步我好早之前就做过了,之前解决国内 git clone 不稳定问题的时候),所以我也不确定。按照原文要求,使用如下指令
ssh-keygen -t rsa -C "你的 GitHub 注册邮箱"
默认不设置密码,直接回车就行(反正我是设了的,估计就是怕别人用我电脑来瞎搞)
用文本编辑器打开生成的 id_rsa.pub 文件,Ctrl + A,Ctrl + C 复制全部内容。
打开 GitHub 的 SSH 设置界面,点击 New SSH Key
,Title 任意,Key 黏贴刚刚赋值的密钥,点击 Add SSH Key
。
配置 Hexo
有请今天的主角:Hexo
选定一个文件夹作为存放博客的目录(比如我的:C:/documents/sources/
),在资源管理器(就是显示文件夹目录的那个窗口)上方的路径中输入 cmd
可以直接打开控制台中,并定位到该目录。
输入命令,安装 hexo:
npm install hexo-cli -g |
-g
代表该包(hexo-cli)是安装在全局范围下的,之后可以任意调用 hexo 的指令[2]。
等待安装完成后,让 Hexo 初始化你的博客框架
hexo init blog-name |
blog-name 输入你的博客名,随意取就行。然后进入该目录
cd blog-name |
现在框架算是搭建好了,测试指令:
hexo s |
s 是 server 的缩写,启动本地服务器。默认情况下,访问网址为:http://localhost:4000/
配置网站信息
在 hexo 帮你初始化好的目录(blog-name)中,会看到一个 _config.yml
的文件。这边建议直接用 vscode 打开整个目录。方便操作
打开 _config.yml
文件,配置 url
url: https://你的 GitHub 用户名.github.io/ |
再到最下方,找到 deploy 字段,默认情况下是空的,添加以下字段:
deploy: |
保存文件,然后安装 Git 部署插件。在站点目录下打开控制台,并输入:
npm install hexo-deployer-git --save |
--save
选项会将模块信息写入package.json
文件中的depencies
字段中,以便在生产环境中使用[3]。
npm ERR! 报错
在这个步骤中,我出现了如下报错信息:
npm ERR! Cannot read properties of null (reading 'matches') |
后来搜了一下,使用 cnpm 就能解决问题。没去深究,具体操作如下[4]
- 安装 cnpm
npm install -g cnpm
- 使用 cnpm 包管理器重新执行指令:
cnpm install hexo-deployer-git --save
部署!
执行以下两个指令
hexo clean |
清除 hexo 数据库,然后 g 是 generate 的缩写,表示生成静态文件;d 是 deploy 的缩写,表示部署到网站上。
这时候打开你的网站地址:https://你的 GitHub 用户名.github.io/
,就能看到文章已经上线咯~
发布博客
在命令行(同样,是在网站的目录中)输入:
hexo n "你想要的文章主题" |
n 是 new 的缩写,表示新建一篇文章。
然后在目录中找到 source/_posts
目录,可以发现目录中出现了一个你刚刚创建的 md 文件。文章用 Markdown 语法撰写。具体可参考 Markdown 教程 | 菜鸟教程
感谢
还是感谢青羽在知乎上给出这个教学,本人只是基于他的教学进行实践后,对于一些坑进行补充。欢迎各位朋友一起搭建属于自己的博客,记录生活哟!!
写在最后
这篇文章写完了,然后就是执行 hexo clean 和 hexo g -d 发布啦!
- 1.一小时搭建完自己的个人网站 - 青羽的文章 - 知乎 https://zhuanlan.zhihu.com/p/78467553 ↩
- 2.What does "npm install -g" do? https://stackoverflow.com/questions/24606341/what-does-npm-install-g-do ↩
- 3.npm install安装的四种用法(-save和-save-dev) - Jessica的文章 - 知乎 https://zhuanlan.zhihu.com/p/583833718 ↩
- 4.hexo在GitHub上创建blog需要安装hexo-deployer-git插件包遇到的报错 - CSDN http://t.csdnimg.cn/lz60k ↩