经过几个小时的折腾,这个简陋的博客算是搭好了!咱算是第一次接触 GitHub Pages + Hexo ,在这个博客的搭建过程中也踩了不少的坑……

这个博客初步的打算是记录我在学习过程中的一些值得记录的东西和收获,同时还有一些游记啊、杂感啊这种乱七八糟的东西。

总而言之,希望有幸来到这个页面的您可以持续关注本站/

之后可能有用的记录

Cloudflare上的A记录

参看一下此处的链接。另外,在 Windows 上,清除本地的 DNS 缓存可通过 ipconfig /flushdns 命令完成。

Hexo的安装及配置

直接放命令啦。

1
2
3
4
npm install -g hexo
hexo init
hexo g
hexo s -p 4000

此时可以透过 127.0.0.1:4000 访问 Hexo 了。

创建新文章需要执行以下命令:

1
hexo new post <title>

关联 GitHub 时,需要先执行

1
npm install hexo-deployer-git --save

接着需要配置 SSH 密钥。在本地使用以下的命令,在 GitHub 账户内的相应位置添加公钥。

1
ssh-keygen -t rsa -C "<mail>"

可以使用以下命令进行验证。如果验证成功,您应当可以看到 GitHub 的用户名。

1
ssh -T git@github.com

然后,在 ./_config.yml 中修改 deploy :

1
2
3
4
deploy:
type: git
repo: [email protected]:name/name.github.io.git
branch: master

如果 SSH 密钥发生了变更,需要重新设定密钥。

1
2
ssh-agent -s
ssh-add ~/.ssh/<key_name>

需要留意,如果在上述操作时出现了以下的错误信息:

Could not open a connection to your authentication agent.

请先执行:

1
eval `ssh-agent -s`

配置完毕后,使用

1
2
3
hexo clean 
hexo g
hexo d

可以完成清除缓存,生成静态文件,部署至 GitHub 的操作。

安装的扩展

SiteMap

站点地图是一种文件,您可以在其中提供与网站中的网页、视频或其他文件有关的信息,并指定这些内容之间的关系。搜索引擎会读取此文件,以便更加智能地抓取网站内容。

For Google:

1
npm install hexo-generator-sitemap --save

另外还有在 ./_config.yml 中进行设置:

1
2
sitemap:
path: sitemap.xml

主题

咱用的是 Maupassant 主题。安装完成之后,常见的修改需要在themes/maupassant/layout/_partial内进行。关于其他的一些设置,主题下面的 _config.yml 文件也需要更改。

数学公式

1
npm install hexo-renderer-mathjax --save

然后更换 Mathjax 的 CDN 源:将

node_modules/hexo-renderer-mathjax/mathjax.html

中的<script>修改为:

1
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

即可。最后,在 _config.yml 内添加mathjax: true

在文内如需使用,可在头上添加mathjax: true,这样本篇 post 便可使用数学公式了。

字数统计/阅读时长

1
npm i --save hexo-wordcount

并在主题下面的 _config.yml 文件内设置:wordcount: true

中/英文标点切换

如果没有进行任何配置,在.md文件下书写的英文标点会在渲染的时候被转换为中文标点。参考 GitHub 上给出的建议,需要安装marked renderer

1
npm install hexo-renderer-marked --save

然后在 ./_config.yml 文件进行设置:

1
2
marked:
smartypants: false

内容压缩

压缩的主要目的是减小 JavaScript / CSS 文件的大小,使得网络传输需要的带宽降低,提高网站的开启速度。此处使用较为方便的插件 hexo-neat 实现。

首先安装插件:

1
npm install hexo-neat --save

接着修改_config.yml文件。向其之中加入以下内容:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
neat_enable: true
neat_html:
enable: true
exclude:
neat_css:
enable: true
exclude:
- '**/*.min.css'
neat_js:
enable: true
mangle: true
output:
compress:
exclude:
- '**/*.min.js'
- '**/jquery.fancybox.pack.js'
- '**/index.js'