随着最近新学的东西越来越多出现看到一些东西总是有“诶,我之前是不是在哪里学过”的人生怀疑,所以是时候来搞一个blog了,记录一下日常学的东西之外顺带可能发点旅游照片什么的,原本以为这就是几行命令的事情,然而到最后没想到自己沉迷在了选主题和配置上了,前前后后搞了快一天才最后终于push到github上。本篇博客用于记录在自己电脑上配置HEXO环境的过程,方便以后可能时不时可能会发生的系统崩溃后的重装系统后来翻阅。如果需要Github端的配置过程请从参考文献中自行寻找。
安装环境
- MacOS X 10.15
安装流程
1. 安装node.js
- 到node.js download page下载对应安装包
- 运行安装包
2. 安装Hexo
- 在需要存放博客项目的位置创建博客文件夹
- 打开终端,cd到刚创建好的文件夹中
- 运行
npm i hexo-cli -g
- 安装完成后输入
hexo -v
确认hexo是否安装成功 - 运行
hexo init&&npm install
初始化
3. 配置Hexo
1. 连接github
此处假设已经创建好了github仓库并且创建好了SSH,创建方法参考参考文献1
打开博客根目录下
_config.yml
, 修改deploy配置:1
2
3
4deploy:
type: git
repository: 自己仓库的地址
branch: master
2. 为每篇博客创建自己的资源文件夹
由于我倾向于每一篇博客都有自己的资源文件以方便管理,所以要修改配置在生成每篇博客的markdown文件时同时生成与其同名的资源文件夹
修改
config.yml
文件1
post_asset_folder: true
输入命令
hexo new post "test"
后会在/source/_post文件夹中找到test.md以及一个名为test的文件夹,这个文件夹可以用于保存博客的图片等静态资源
3. 让博客正常显示图片
在默认配置下在本地markdown文件的图片是无法正常显示在网页上的,需要安装一个包来进行本地图片路径到网页路径的转换,当然Hexo图片插入提供了多种解决方案,这里只列出我倾向的一种
安装插件
1
npm install https://github.com/CodeFalling/hexo-asset-image --save
保证图片放在/source/_post目录下与markdown同名的文件夹下,在markdown中插入:
1
![图片描述](markdown文件名/图片名)
图片此时部署后可以正常显示
4. 让Next主题博客正常显示数学公式
本博客使用的是next主题,需要进行一些配置才能让网站正常解析Latex数学公式,详细原因参考Hexo 的 Next 主题中渲染 MathJax 数学公式
更换Hexo的 markdown渲染引擎
1
2npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save修改可能会产生语义冲突的符号
修改node_modules/kramed/lib/rules/inline.js 第11行为:
1
escape: /^\\([`*\[\]()#$+\-.!_>])/,
修改此文件第20行为:
1
em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
重新启动hexo
1
hexo clean && hexo g
在next主题中打开MathJax
进入/themes/next找到
_config.yml
修改math下的enable为true,并且同时修改mathjax为true:1
2
3
4
5
6
7
8
9
10
11
12
13math:
enable: true
# Default (true) will load mathjax / katex script on demand.
# That is it only render those page which has `mathjax: true` in Front-matter.
# If you set it to false, it will load mathjax / katex srcipt EVERY PAGE.
per_page: true
# hexo-renderer-pandoc (or hexo-renderer-kramed) required for full MathJax support.
mathjax:
enable: true
# See: https://mhchem.github.io/MathJax-mhchem/
mhchem: false在需要渲染数学公式的markdown的header中打开mathjax:
1
2
3
4
5
6
title: xxxx
date: xxxxx
tags:
mathjax: true
--