hexo搭建博客（一）

原文请戳：http://chosenwu.com

本人前端新人一枚，之前都是在CSDN或者简书上面写点东西记录自己的一点一滴。一直想自己搭建一个博客，前段时间在看vue文档，想着用 Node.js + Vue.js + MongoDB搭建一个博客系统，怎奈自己技术目前还比较渣。。。之后看多好多用hexo搭建的博客，所以自己也试着搭建了一个，本文将介绍我使用hexo搭建这个博客的过程。

环境准备

安装Node.js

下载地址
直接点击下载安装就可以（官网有两个版本，下载左边的通用版）

安装git

下载地址
安装正确的话，在桌面或文件夹空白处鼠标右键菜单会新增 Git GUI Here 和 Git Bash Here 两个选项
mac的话直接用终端就行了

安装Hexo

npm install hexo-cli -g

安装完成之后接着输入 hexo -v 检查是否安装成功

创建仓库并配置ssh

这里建议用ssh建立传输

创建仓库

在github上创建一个仓库，仓库名称必须是 你的github账户名.github.io

ssh配置（已经配置过的自行跳过）

1、检查本机是否已存在ssh秘钥

$ cd ~/.ssh$ ls

如果提示不存在此目录，则进行第二步操作，否则，你本机已经存在ssh公钥和私钥，可以略过第二步，直接进入第三步操作

2、生成ssh秘钥

$ ssh-keygen -t rsa -C "这输入你的邮箱地址"Generating public/private rsa key pair.Enter file in which to save the key (/Users/your_user_directory/.ssh/id_rsa): # 这里回车就行Enter passphrase (empty for no passphrase): # 这里创建密码，在以后提交项目时候会让你输入密码，最好还是创建一下Enter same passphrase again: # 确认密码

代码参数含义
* -t 指定密钥类型，默认是 rsa ，可以省略
* -C 设置注释文字，比如邮箱
* -f 指定密钥文件存储文件名
执行完以后，可在你的用户根目录下看到刚生成的文件：id_rsa 和 id_rsa.pub，即公钥和私钥

3、在GitHub账户中添加公钥
进入github登录账户，点击头像进入settings，然后点击侧栏的 SSH and GPG keys 按钮；点击 New SSH key 按钮创建，Title可以任意填写，但是应该填写的有意义一些，将上一步骤生成的id_rsa.pub的内容复制到这里的Ke输入框里面，最后点击 Add SSH key 完成创建。

4、确认

$ ssh -T [e-mail]

如果是下面这个反馈：

The authenticity of host 'github.com (207.97.227.239)' can't be established.RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.Are you sure you want to continue connecting (yes/no)?

直接输入yes就行了，最后看到这行文字就说明成功了：

Hi "这里是你的名字"! You’ve successfully authenticated, but GitHub does not provide shell access.

设置用户信息

现在你已经可以通过SSH链接到GitHub了，还有一些个人信息需要完善，Git会根据用户的名字和邮箱来记录提交，GitHub也是用这些信息来做权限的处理，输入下面的代码进行个人信息的设置，把名称和邮箱替换成你自己的，这里用户名不要填你的github昵称

$ git config --global user.name "name" # 用户名$ git config --global user.email  "[e-mail]" # 填写自己的邮箱

好了，到这里环境已经配置完成，接下来就是部署Hexo了

部署Hexo

部署

现在自己找一个存放博客源码的文件夹，在你文件夹下打开 git bash，执行：

$ git init 

Hexo随后会自动在目标文件夹建立网站所需要的所有文件，完成之后需要安装一下所需的依赖包（记得要科学上网）：

npm install

安装完成之后本地就算部署完成了，接下来我们更改一下配置文件并将博客部署到远端仓库

Hexo常用命令

这里穿插介绍一下hexo常用的命令：

$ hexo generate # 生成静态文件，会在当前目录下生成一个public文件夹$ hexo clean # 会清除缓存文件db.json及之前生成的静态文件夹public$ hexo deploy # 这个命令会在博客根目录下生成一个.deploy_git的文件夹，并部署到远端仓库（需要配置）$ hexo server --debug # 开启本地服务进行调试$ hexo new "postName" #新建文章$ hexo new page "pageName" #新建页面

常用命令可以简写：

$ hexo n == hexo new$ hexo g == hexo generate$ hexo s == hexo server$ hexo d == hexo deploy

常用组合命令：

$ hexo d -g # 生成部署（需要配置，在后面介绍）$ hexo s -g # 生成预览

现在我们执行预览命令就可以通过http://localhost:4000来预览我们的博客了
这里要注意每次生成部署之前我们应该执行 hexo clean 清除一下，然后重新部署

部署到Github Pages

在生成部署之后，此时的目录结构为：
- deploy // 执行hexo deploy命令部署到GitHub上的内容目录
- public // 执行hexo generate命令，输出的静态网页内容目录
- scaffolds // layout模板文件目录，其中的md文件可以添加编辑
- source // 文章源码目录，该目录下的md和html文件均会被hexo处理。该页面对应repo的根目录，404文件、favicon.ico文件，CNAME文件等都应该放这里
- themes // 主题文件目录
- _config.yml // 全局配置文件，大多数的设置都在这里
- package.json // 配置依赖
- debug.log // 调试日志
- db.json // 数据

我们需要对主配置文件 _config.yml 进行部分修改：

1、修改网站相关信息

title: Chosenwu's Blog # 网站的标题subtitle: # 网站的副标题description: # 网站描述author: Chosen Wu # 网站所有者language: zh-Hans # 语言timezone: Asia/Shanghai # 市区

注意这里语言和市区是有输入规范的

2、配置统一资源定位符（个人域名）

url: http://chosenwu.com

3、配置部署

deploy:  type: git  repo: [e-mail]:wuchongzi/wuchongzi.github.io.git # 仓库的地址  branch: master # master分支

在配置文件修改完成之后我们执行以下命令发布到远端：

$ hexo clean$ hexo d -g

在这里应该会部署失败，因为我们还缺少一个依赖，执行下面的命令来安装：

npm install hexo-deployer-git --save

安装完成之后再次执行部署命令，不出意外会部署成功

成功之后在浏览器地址栏输入我们在github创建的仓库的名称，即 name.github.io，就能看到发布的博客

总结

每次写完博客都要用到的命令：

$ hexo clean$ hexo d -g

参考文章

使用ssh连接gitHub
如何搭建一个独立博客——简明Github Pages与Hexo教程