一、什么是Hexo?
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
二、准备工作
你需要:
1、NodeJS
环境,请参考 NodeJs官网
2、Git
,请参考 廖雪峰的Git教程
3、一个Github账号
三、安装Hexo
检验NodeJs安装:
$ node -v
若安装成功会显示NodeJs
版本号,例如:
$ v9.6.1
接着,在命令行中输入:
$ npm install -g hexo-cli
由于国外网络延迟的关系,下载速度太慢或者某些依赖安装失败,请安装淘宝NPM镜像
,设置镜像的方法和使用规则详见:https://npm.taobao.org。
至此,若无意外情况,Hexo安装完毕,若有疑问请参考 Hexo官方手册
四、Github Pages使用
- 登录
Github
,在右上角选择New repository
,新建一个repository
,并且命名为username.github.io
,注意把username
替换成你申请账号的用户名,其余不要变。 - 使用
git clone https://github.com/MeetMax/meetmax.github.io.git
命令将项目克隆到本地,这里以我自己的项目为例。 - 进入文件夹
cd meetmax.github.io
- 新建
index.html
文件,在里面输入
<!DOCTYPE html>
<html>
<head>
<title>hello world</title>
</head>
<body>
hello world
</body>
</html>
- 将文件提交到
Github
仓库,在meetmax.github.io
文件夹运行命令:
$ git add .
$ git commit -m "hello"
$ git push origin master
6.在浏览器打开 https://meetmax.github.io/
,若显示hello world
则说明配置成功,注意将meetmax
替换成自己的账号。
五、搭建Hexo博客
1. 初始化博客目录
$ hexo init meetmax.github.io
$ cd meetmax.github.io
$ npm install
2. 生成静态页面
$ hexo clean // 清空代码,初始化
$ hexo g // g表示generate,生成静态页面
3. 运行项目
$ hexo s // s 表示 server
然后打开浏览器输入:http://localhost:4000/
查看
4. 发布文章
$ hexo new test
这时候会在source/_post
文件夹生成test.md
文件,或者直接手动在source/_post
文件夹下新建test.md
文件。再次运行命令:
$ hexo clean
$ hexo g
$ hexo s
5. 配置
网站的配置大部分都在_config.yml文件中:
- title -> 网站标题
- subtitle -> 网站副标题
- description -> 网站描述
- author -> 作者名字
- language -> 网站使用语言
6. 需要注意的坑
配置文件名字冒号后面必须加空格,例如 title: meetmax
,否则配置不生效。
7. 更换主题
我用的是Yilia
主题,这里就以该主题为例
- 克隆主题到
theme
文件夹
$ cd themes
$ git clone https://github.com/litten/hexo-theme-yilia.git
- 配置主题
修改项目文件夹下的_config.yml
文件,配置如下:注意加空格,否则无效
theme: hexo-theme-yilia
六、部署到Github
1. 安装 hexo-deployer-git
$ npm install hexo-deployer-git --save
若出现下面的错误,请设置public key
,若不懂请使用搜索引擎
Permission denied (publickey).
fatal: Could not read from remote repository.
Please make sure you have the correct access rights
and the repository exists.
2. 在_config.yml
中配置 Git,以我自己的为例:
这里要注意 repo
是 ssh
地址,非 https
deploy:
type: git
repo: git@github.com:MeetMax/meetmax.github.io.git
branch: master
3. 部署到Github
$ hexo d // d表示deloy
4.访问
打开浏览器访问:https://meetmax.github.io/