利用Hexo、GitHub Page、Typora写文章

之前分享过一篇利用 Typora写文章并上传到微信公众号的文章

同时分享过一篇 Halo这个基于Spring的博客系统

近期由于服务器要求公安备案，海外的服务器访问速度过慢，Cloudflare的IP现在也被封的差不多了，被逼无奈计划使用Hexo+Github Page搭一套博客，两天下来感觉使用良好，未来可能会成为我长期使用的内容平台。

Hexo安装

前期准备

1. 安装最新版的node

没有的话自己安装一下，此外记得添加国内的镜像源头

npm config set registry https://registry.npm.taobao.org

2. 安装Git

没有的话自己安装一下，不过最近由于众所周知的原因，需要挂代理

git config --global http.proxy 'socks5://127.0.0.1:7890'
git config --global https.proxy 'socks5://127.0.0.1:7890'

3. 注册GitHub账号

打开Github官网，新建一个仓库，输入自己的项目名字，后面一定要加.github.io后缀，README初始化也要勾上。*名称一定要和你的github名字完全一样，比如你github名字叫abc，那么仓库名字一定要是abc.github.io Description空着就可以，记得要选public

4. 建立GitHub Pages

项目建好后，点击Settings，向下拉到最后有个GitHub Pages，点击Choose a theme选择一个主题。等待系统自动生成页面后，再回到GitHub Pages，可以修改自定义域名了，这里我们先不做操作，因为要生成一个CNAME的文件，等会我们在Hexo里面创建，这样比较简单。

5. 更改DNS解析

在DNS解析的地方添加一条CNAME记录，把你想要的域名指向你的仓库名（这就是为什么前面说项目名字加.github.io的原因）

安装Hexo

1. 安装程序

在合适的地方新建一个文件夹，用来放置自己的博客文件，比如我因为有两台电脑，相互间使用iCloud的进行同步，因此我就放在了/Users/xxx/Documents/blog目录里面

目录建好之后用终端打开该目录，在该目录下输入npm i hexo-cli -g安装Hexo

安装完后输入hexo -v验证是否安装成功。

然后就要初始化我们的网站，输入hexo init初始化文件夹，接着输入npm install安装必备的组件

这样本地的网站配置也弄好啦，输入hexo g生成静态网页，然后输入hexo s打开本地服务器，然后浏览器打开http://localhost:4000/，就可以看到我们的博客啦，按ctrl+c关闭本地服务器，准备上传

github的配置应该不用赘述，唯一需要提醒的是，现在需要挂代理，需要挂代理，需要挂代理，不要抱着侥幸的心理，不然同步博客的时候你会想死

2. 修改hexo配置

在不熟悉的情况下只要记得修改一个地方，其他的看一看也就会了，这里需要注意的是，你需要把_config.yml这个文件编码改成UTF-8，以避免中文标题乱码

deploy:
  type: git
  repository: https://github.com/wellmoonloft/wellmoonloft.github.io.git
  branch: main

注意brach里面你写什么，在Github Pages里面设置的源要对应起来，设置main就选main，设置master就选master，这个无所谓的

3. 修改文章模版

在开始新建文章之前最好是改一下文章模版，位置就在你选择的目录下面scaffolds文件夹里面，改post.md 就可以了，这样你新建文章他会自动加一个你想要的标题，你就不用再每个手动去写了

---
title: {{ title }}
date: {{ date }}
tags:
categories: default
---

4. 新建一个文章以及文章迁移

首先在博客根目录下，安装一个扩展npm i hexo-deployer-git。

然后输入hexo new post "new article title"，新建一篇文章。

然后打开/Users/xxx/Documents/blog/source/_posts的目录，可以发现下面多了一个new article title.md文件，就是你的文章文件，你可以直接用Typora打开进行文章编写，也可以直接把你之前所有的文章复制到这个目录当中。但需要注意的是，你不通过命令新建的话，就需要手动给每一篇文章加个头，而且不能直接输入，需要使用源码模式进行复制，或者用Sublime Text或者Xcode打开进行复制

非源码模式

源码模式

5. 上传并同步博客

编写完markdown文件后，blog目录下输入hexo g生成静态网页，然后输入hexo s可以本地预览效果，最后输入hexo d上传到github上，这时打开你的github.io主页就能看到效果了

6. 绑定域名

等了这么久，DNS解析应该已经生效了，这时候访问这个域名，会发现已经到了github的页面，只是因为没有链接关系报错。现在在本地博客/source目录，我的是/Users/xxx/Documents/blog/source ，新建CNAME文件，注意没有后缀。然后在里面写上你的域名，保存。最后运行hexo g、hexo d上传到github，刷新几下，就可以看到你的博客页面了