Github 仓库

  • 首先你必须有一个 github 账号

  • 然后新建一个仓库，这一有第一个坑，我之前用了不同于 github 用户名(Hugking)来作为项目名称（wkaanig.github.io），一直没能搭建成功，后来看到其他大牛的经验，才发现项目名一定要是用户名(Hugking).github.io 的形式(README.md 可选可不选)

  • 在 github 中 setting 添加生成页面的选项 Source 选择 master branch

    注意：
    如果你之前没有用 git 关联过自己的 github 库，需要配置 SSH 等参数，否则无法成功，这部分搜 git 就有很多相关教程

安装前提

hexo 有中文的文档，这一点非常方便，但是在安装过程中还是很容易有疏忽的地方，导致安装失败。
安装 Hexo 之前，必须保证自己的电脑中已经安装好了 Node.js 和 Git。因为这两个软件我之前都安装过，这里就不重复安装过程了，检验方式如下：

1
2
$git --version
$node --v

安装 Hexo

安装好 node.js 和 git 后，可以通过 npm 来安装 Hexo。

1
2
3
npm install -g hexo-cli
hexo v # 查看版本
npm install hexo-deployer-git --save # 安装 git 插件

初始化

之后就可以在电脑里新建一个文件夹来作为存放博客全部内容。我们直接用 hexo 命令来初始化文件夹：

1
2
3
hexo init <folder>
cd <folder>
npm install

<folder>就是文件夹的名字在创建的时候 ，文件夹初始化已经把需要的内容都下载进去了。

注意：
<folder>必须是一个空的文件夹，否者会创建失败

本地运行

1
hexo s # 启动服务器，在本地查看内容

在 source->_posts 文件夹下，有一篇 helloworld 的初始化文章，在地址栏中输入http://localhost:4000/
我们就可以看到博客内容，我们的博客运行成功啦！！！

配置

打开配置文档_config.yml，对它做如下修改，repo 后面的内容是 git@gitbub.com:username/库地址的形式

1
2
3
4
deploy:
  type: git
  repo: git@github.com:Hugking/Hugking.github.io.git
  branch: master

注意:
属性和内容之间一定要有一个空格，配置文件有自己的格式规范。

上传项目

1
2
hexo g
hexo d

第一次部署的时候，我们会重点用到 hexo init 这个命令外，在平时写博客和发布过程中最常用的就是：

1
2
3
4
hexo n <filename> 新建文章
hexo s 启动服务器，在本地查看内容
hexo g 生成静态页面
hexo d 部署到网站

以上四个步骤。

其实以上命令我觉得就足够了，文档里还有很多功能,搭建好后我们在https://用户名(Hugking).github.io就可以看到博客内容。

主题选择

在 hexo 官网上下载自己喜欢的 theme，点击图片可以预览主题，点击图片下面的文字就可以打开 github 下载链接。

复制源码的 url，在 git hash 命令窗口下载主题，输入git clone url，注意得手动粘贴，Ctrl+v无效

接着，将配置文件_config.yml 中的 theme 改为新的主题的名字，记住一定要将下载下来的文件夹放到 themes 文件夹里！

文件解释

新建好的文件夹目录如下：

1
2
3
4
5
6
7
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

_config.yml

博客的配置文件，博客的名称、关键词、作者、语言、博客主题…设置都在里面。

package.json

应用程序信息，新添加的插件内容也会出现在这里面，我们可以不修改这里的内容。

scaffolds

scaffolds 就是脚手架的意思，这里放了三个模板文件，分别是新添加博客文章（posts）、新添加博客页（page）和新添加草稿（draft）的目标样式。
这部分可以修改的内容是，我们可以在模板上添加比如 categories 等自定义内容

source

source 是放置我们博客内容的地方，里面初始只有两个文件夹，一个是 drafts（草稿），一个 posts（文章），但之后我们通过命令新建 tags（标签）还有 categories（分类）页后，这里会相应地增加文件夹。

themes

放置主题文件包的地方。Hexo 会根据这个文件来生成静态页面。
初始状态下只有 landscape 一个文件夹，后续我们可以添加自己喜欢的。

总结

以上为初次使用Hexo的基本步骤，下次我们来说如何创建并发布一篇新文章，作为小白，要走的路还很长，加油吧！