Hexo+GithubPages搭建自己的博客

一、基础

第一步：打开终端(cmd)

第二步：新建一个文件夹命名为 “blog”

windows下配置了vim（或macos下）可使用如下命令

mkdir blog

第三步：到blog目录下

cd blog

第四步：执行如下命令，初始化一个hexo项目

hexo init

第五步：执行如下命令，建立一个新的markdown文件

hexo new "my first article"

或使用如下简化命令

hexo n "my first article"

查看是否成功创建my-first-article.md文件(文件名中的空格会被-替代)

cd source/_posts
ls

第六步：编辑 my-first-article.md文件

vim my-first-article.md

i键进入插入模式，在.md文件中输入如下内容

## Chapter1

chapter content

## Chapter2

chapter2 content

esc退出插入模式，输入:wq保存并退出

第七步：执行如下命令，安装Github Pages得部署工具

npm install hexo-deployer-git --save

第八步：在Github上新建一个空项目，并命名为username.github.io
注意1：项目名称必须严格为username.github.io格式
例如，我的github用户名为Seal-Li，那么这个新建的项目名称就必须要是 Seal-Li.github.io

注意2：必须时一个空项目
gitignore, license, README.md等文件在创建时也不要勾选，保持全空

第九步：编辑blog文件夹下得_config.yml文件
先回退到blog文件夹目录下

cd ../.. # 回退两级目录

使用如下命令，编辑_config.yml文件

vim _config.yml

i键进入插入模式，在.yml文件中输入如下内容
注意：deploy和type时已经存在的直接编辑即可
repository和branch参数需要自行添加

deploy:
  type: git
  repository: 你新建的git仓库地址
  branch: master

第十步：执行如下命令，生成网页

hexo generate

也可以使用简化命令

hexo g

第十一步：本地查看是否已经成功生成

hexo server

或使用简化命令

hexo s

按住ctrl键，然后点击终端给出的 http://localhost:4000/ 链接，预览网页

回到终端 Ctrl+C 关闭hexo server

第十二步：执行如下命令，部署到GithubPages

hexo deploy

或使用简化命令

hexo d

到这里使用默认主题的hexo博客就搭建完成了！

二、主题

下面介绍如何更换自己喜欢的主题(在这里Hexo Theme可以查看hexo支持的各种主题)，我们以fluid主题为例

第一步：安装fluid主题

fluid 主题的github主页，也可以在Hexo Theme中找到

进入到blog目录下

cd blog

安装fluid主题

npm install hexo-theme-fluid --save

第二步：新建_config.fluid.yml文件

touch _config.fluid.yml

复制fluid主题的配置文件(blog/node_modules/hexo-theme-fluid/_config.yml)内容到新建的_config.fluid.yml文件中

第三步：编辑blog目录下的_config.yml文件
修改theme参数

vim _config.yml

/theme 进入搜索模式，

theme参数的默认值如下，找到它

theme: landscape

i进入插入模式，将其修改为

theme: fluid

第四步：依次执行如下命令

hexo clean # 防止之前进行过 hexo g操作，所以先进行一次clen

hexo g

hexo d

到此主题就已经更换完成了，其他参数的调整可以参考主题的文档。

三、blog文件夹托管到github或gitee（建议）

每次生成网页都依赖于blog文件夹，如果不小心删除了，那就没了，因此将其托管到远端，因为blog文件夹可能会比较大，github连接上传较慢，可使用gitee效率更高，具体操作这里就不再细说了。