本文首发于https://wzl-plasmid.github.io/，欢迎来我的博客玩喵
最近不是很想说话，也好久没水论坛了😔就拿今天刚写的文章凑个数吧

除夕夜不想看春晚，趁着这个时间搭了一个简单的博客，那么第一篇博客就来记录一下搭博客的过程吧。

由于整个过程比较复杂但实在没啥技术含量，这篇文章只是汇总一下教程文档，记录一下踩坑过程。

这个博客创建的契机是一次我试图用知乎发一个用Markdown写好的教程，但碰巧我的Zhihu on VSCode插件寄了，完全登录不上去。而知乎网页端对于导入的Markdown代码支持也是依托答辩，很多样式只能依靠我手动添加，这让几乎每天都在用Markdown的我非常不爽。同时看到过不少同学搭建过自己的博客，上面也有很多高质量的内容（~~帮我活过了概统考试~~），于是我也开始想着自己搭一个博客出来。

其实本人非常懒，不喜欢折腾。于是我对于博客搭建的要求就是能用就行，不想自己搭服务器买域名之类的，图床也是直接用的GitHub。

至于GitHub在大陆不稳定的问题🤔无所谓，我一直挂着Clash🤣

Step0: 观前提示

我使用的环境为Windows 10，但是在macOS和Linux上大概都可以搭好，至少Git、Node.js和Hexo的安装都是可行的。

搭建博客看着工程量庞大，但网上已经有详细的文档教程，完全照着文档和教程跑下来就好，我真的没碰上什么问题。

唯一一个比较重要的技能可能是需要反复敲命令行，这里再次感叹一下熟练使用命令行和各种命令行风格工具的重要性😢（~~虽然我差不多也习惯了~~）

输入命令行需要终端，最简单的终端是命令提示符，可以在搜索框中搜索cmd或者在文件夹顶部地址栏输入cmd然后按回车，但我一般用Windows Terminal，VSCode集成的也不错。

Step1: 安装Hexo

Hexo是一款快速、简洁、高效的博客框架，可以将Markdown文档非常高效地渲染成网页，也提供了各种风格的模板。看到过不少人在用Hexo，就决定是它了！

本步骤其实只需要严格按照Hexo官方文档跑一遍下来就行了，就是事情稍微多了点（需要先安装Git和Node.js）

安装Git。Git的安装请参考这篇文章，Git的配置请参考GitHub上的教程1，SSH Key的配置请参考GitHub上的教程2。此外强烈建议用clash买个节点然后给Git设置代理，不然很可能连不上！
安装Node.js，建议选择LTS版本。Node.js的安装请参考这篇文章。注意选择Add to PATH，此外中间有个“automatically install the necessary tools”选项，我点了之后帮我安装了很久的东西，还帮我装了Python3.11.0，直接挤掉了我在用的Python3.9.6，看网上似乎可以不选，所以还是建议不选。
安装Hexo。按照Hexo的官方文档，只需要npm install -g hexo-cli，但我还是遇到了一些问题。首先是报错：'hexo' 不是内部或外部命令，也不是可运行的程序。此时需要手动设置一下环境变量，请参考这篇文章。其次是报错：无法加载文件hexo.ps1，因为在此系统上禁止运行脚本。这是终端的问题（我用的Windows Terminal），需要在Windows设置里修改一下，请参考这篇文章。

Step2: 挑选Hexo模板

要知道大多数人的博客看起来高大上只是因为使用的模板比较高大上（不会开发前端是这样的Orz）

Hexo官方整理了很多可用的模板，但这上面的模板实在是太多了，很容易选择困难症。此外很多信息已经过时了，不少模板点开来发现网站已经404了。

因此个人只推荐文档完善且近期在GitHub上有人维护的模板。这是因为Hexo不仅包括对Hexo自身的“站点配置”，也包括对所用模板的“主题配置”。在主题配置中，不同模板之间差异较大，没有详细的文档或教程非常容易一头雾水。

下面我来推荐几个这两天挑过的模板吧（有什么推荐的也欢迎在下方回复作为补充😘）

NexT是一款非常经典的模板，风格简约所以更强调文字，整个生态很完善，看到很多人在用诶。

Fluid是一款Material Design风格的模板，评价是很好看，网页本身支持侧边栏导航等，所以感觉功能也很完善。此外文档非常详细，配置文件各个参数讲得很清楚。与之风格类似的模板是Material，但一直没人维护，故不再推荐。

Fluid

kira顾名思义，是一款kirakira✨的模板，看得我dokidoki❤（~~梗小鬼差不多得了~~）大概是这么多模板里最二次元的一个，文档看起来还行但不算太详细，就放上来骗骗二次元吧🤣（开发者似乎是山东大学的，现在大四，tql）

kira

ParticleX支持很多花里胡哨的JS动效，同时也挺二次元的，文档在作者的博客里自己找，其实也很详细，有些问题可以在issues里找到答案。

ParticleX

我个人在用的就是ParticleX模板，用的人没有NexT或者Fluid那么多，但个人感觉ParticleX的质量已经很高了。主要的问题在于：加载页面需要等待，不支持侧边栏导航，只会在标点后换行，不支持访问人数统计，Markdown加粗效果不明显（不如用HTML标签调颜色）而且会导致行距问题等，但总体来讲我还是挺喜欢的（~~因为比较二次元~~）

Step3: 部署模板和配置

按照Hexo官方文档，首先新建一个目录，输入命令hexo init，然后在当前文件夹下的themes文件夹里放入模板文件。

接下来对_config.yml文件进行配置，不仅需要配置博客根目录下的_config.yml文件（配置整个站点的属性），还需要配置模板文件夹下的_config.yml文件（配置当前模板的功能）。这两个文件虽然文件名一样，但它们是有区别的，一般文档中都会强调这两者之间的区别。这个建议自行参考Hexo官方文档和各种模板自带的文档，具体问题具体分析。

顺带一提，由于需要处理YAML文件、Markdown文件，可能还有JS文件（我这个模板里的动效需要手动改JS），所以建议直接全用VSCode作为文本编辑器。

Step4: 图床搭建

图床就是用来在云端存储图片的一项服务。我的建议是用PicGo作为图床管理工具，管理所有图片的上传和链接。至于用什么图床、怎么配置，我的建议是参考PicGo官方文档，然后在支持的图床里挑一个。支持的图床种类还是非常多的。

Step5: 评论系统

我使用的评论系统是Waline，支持匿名评论、Markdown语法、LaTeX语法、图片等，自带的表情非常丰富，甚至有贴吧表情🤣同时配置并不复杂，照着官网跑一遍，然后去翻自己用的模板提供的文档，会教你怎么把评论系统的网站整合到博客页面里。

悲报：评论系统搭好了半天似乎就开始不定期宕机了，我日

Step6: 创作博客

在终端中输入hexo new <标题>创建一篇新的博客。需要注意在终端中输入中文很可能会出现乱码，这是因为你的终端默认使用了GB2312编码，你需要用命令chcp 65001切换为UTF-8就不会出现乱码。但这条命令只会在当前终端生效，如果想一劳永逸，对于Windows Terminal，请使用命令powershell.exe -NoExit chcp 65001。

注意这里的<标题>参数是指.md文件名称和博客url中的部分，所以这个参数我建议用英文。而打开该.md文件后，顶部的Front-matter区域还有一个title参数，这个是在你的博客页面中显示的标题，默认为刚才指定的标题参数，但它是可以修改的。

然后就可以在博客根目录下的source/_posts文件夹里看到对应标题的.md文件。这就需要大家会写Markdown了，但这其实很简单，我反正10分钟就速通了。

此外，About页面、Categories页面和Tags页面的生成请参考自己所用模板的文档，而对博客进行归档需要设置Markdown文件顶部的Front-matter，请参考Hexo官方文档。

Step7: 页面预览

在博客根目录下输入hexo server或者hexo s生成静态文件并在本地启动服务器。如果有报错，顺着报错解决这些问题；如果没有报错，就打开浏览器输入https://localhost:4000/预览页面。此时对文章或者配置进行修改后，只需要保存并刷新页面就可以实时看到效果。

Step8: 部署页面

我选择部署到GitHub Pages，方法就是新建仓库username.github.io然后把页面上传到这个仓库的main分支，其中username就是你的GitHub账号id。具体方法参考这篇文章，一切确认无误后用hexo deploy部署。

如果你需要部署到其他页面，请参考Hexo官方文档或自行查资料。

Step9: GitHub Pages加速

你可以把你的GitHub Pages部署到Netlify或者Vercel上，它会根据你的提交记录自动同步，据说是能给页面加速。在搭建评论系统Waline的时候我已经用到了Vercel，所以直接试了一下，操作非常简单（参考Vercel官方文档）。然后我关掉clash试图分别从GitHub Pages和Vercel进入我的博客，结果一个都打不开，ping了一下也都ping不通😭

于是我开始尝试Netlify，据说在大陆的访问速度还可以，能用。但不知道是不是登录时出现了问题，总之用我的GitHub账号会遇到Authentication Error问题，用其他邮箱注册之后账号又会被suspend😭你就说你让不让我用吧，你让不让！

此外朋友还建议我挂一个Cloudflare Pages或者用jsdelivr，但此时我已经心灰意冷了。

我的宗旨一直是能用就行嘛，摆了！

Step10: To-Do List

首先就是这个折磨人的访问速度问题，由于本人对计算机网络一窍不通，我也不知道该怎么继续折腾，是部署到国内的服务器还是用上面提到的方式加速，这么折腾的时间成本略高，总之我摆了。大家有什么好的方法也可以在评论区里交流。

其次我觉得这个图片多少有点单调了，现在这个主页图片是写死的，我很喜欢这张图，但是看久了多少容易审美疲劳，所以考虑用一些随机图片接口，但是又要折腾了，总之我又摆了。

写了一晚上就水了这么短短一篇文章，那就写到这里吧。如果我的文章对你能有那么一丢丢帮助，那就是我的幸运！