Hexo博客搭建(github篇)

啊,今天来记录一下 Hexo 博客的搭建。

之前搭建博客,一直都是买个 VPS,一键安装 wordpress,无脑搭建,快速省力,但是wp一定程度稍显些臃肿,我的需求其实就是建立一个写写文章的地方,于是就选择了Hexo。
文章以 Mac 作为演示,Windows 系统操作基本一致。

文章目录

  1. SSH 密钥
  2. 安装和初始化 Hexo
  3. 新建 Github 仓库
  4. Hexo 与 Github 绑定
  5. 开始第一篇文章

SSH 密钥

SSH 一方面是一种更加安全的传输方式,另一方面是我们在写完新文章后,通过 hexo 的 deploy 命令来部署到 github 时,不需要一次次的输入用户名和密码。

设置全局 git 信息

打开终端 terminal

分别输入以下信息,设置git 信息,其中 XXX 和 XXXX@XXXX分别代表 github 的用户名和邮箱
git config –global user.name “XXX”
git config –global user.email “XXX@XXX.com”

创建 SSH 密钥

ssh-keygen -t rsa -C "XXX@XXX.com"

一路回车,直到出现提示,则标识创建成功,Mac 默认生成在.ssh 文件夹

现在要做的就是获取密钥内容,利用 cd 命令在终端依次输入,以下内容
进入.ssh 文件夹

cd .ssh

打开密钥所在文件夹(Mac 下默认隐藏),会发现有两个文件,利用文本编辑工具打开,并复制所有内容。请注意不要随意分享 SSH

open .

添加 SSH 密钥到 Github

打开浏览器,进入github 的 SSH 设置页面:https://github.com/settings/keys,点击右上角 New SSH key 按钮

点击 Add SSH key 按钮,即可完成 github 和 SSH 配置。

接下来开始安装 Hexo

安装和初始化 Hexo

安装 nodejs

可以去官网下载安装包安装,验证是否安装成功,可在终端输入

node -v

如果显示 v8.9.1这样的 版本号,代表成功安装。(我安装 nodejs 从来没出过问题,如果有问题,推荐先去官网的论坛)

安装 git

由于 Mac 系统自带了 git,没有安装的朋友,可以去官网按照步骤安装即可,请下载命令行版本(点击官网右侧的 DOWNLOAD 即可),非 GUI 版本。

安装 Hexo

唔,经历那么多准备,终于开始最主要的部分了。
Hexo中文官方文档

为了方便管理,我选择了把 hexo 安装了我指定的目录,依旧通过 cd 命令,定位到指定的文件夹,我本地的目录在 Documents 里的 nulluocom 文件夹里
先定位到 Documents 文件夹

cd Documents

再定位到 nulluocom 文件夹

cd nulluocom

开始安装 Hexo

npm install hexo-cli -g

如果安装提示失败,则尝试管理员权限安装

sudo npm install hexo-cli -g

当终端显示安装完成后,输入

hexo

或(如果hexo 显示没权限的话)

sudo hexo

如果终端显示如下,则代表 hexo 成功安装

初始化Hexo

安装成功后,现在需要将 Hexo 初始化,输入hexo初始化命令(sudo 情况同上,以下不再重复)

hexo init

成功后,可在文件夹里看到以下文件

用文本编辑工具打开 _config.yml 文件,这是你的博客的基本信息和其他配置

这时候是不是发现还没有 github 地址?别急

新建 Github 仓库

新建一个公开项目(私人也行,你付钱吧,233),请在仓库名输入 github 用户名.github.io,对的,你只能把前面的 github 用户名部分替换成你自己的,后面必须保留。

创建完成后,进入到你的项目,找到下图中的内容

红框内为复制此仓库路径地址按钮,点击后,回到刚才那个配置文件,填写repo地址位置

保存这个配置文件,恩,现在最大多数的都完成了。

试试在终端输入这个

hexo server

等待终端提示

打开你的浏览器,把这段 http://localhost:4000/ 地址,复制到浏览器里,回车,如果你看到了一个网站,恭喜你,你的本地 hexo 博客已经搭建好了
好了,现在在终端按ctrl+c停止本地服务器,现在我们要报这些东西都布到 github 你刚才新建的项目里。

hexo generate

或缩写

hexo g

Hexo会按照当前的文章,自动生成静态 html 页面
再输入

hexo deploy

或缩写

hexo d

会根据刚才配置文件你填写的 repo 地址,把你本地的东西都布到了 github 上。

有时候输入hexo d````会提示失败,可以先尝试输入`npm install hexo-deployer-git --save命令后,再次尝试hexo d\`\,基本可以解决此问题。`

Hexo 与 Github 绑定

但现在你输入你在域名商购买的地址,是不是还是显示没东西?那肯定了,因为你买的域名没有解析到 github 你创建的仓库上,这时候你需要去你的域名商的 dns 设置,我用的 DNSpod,以此为例

添加一条记录,记录类型选择 CNAME,记录值填写刚才新建的 github 项目名称,对就是用你的 github 帐号名.github.io,这个地址保存,恩,完成了,现在再看看是不是就有了?

如果还是没有,在终端依次输入

hexo clean
hexo g
hexo d

成功后,就可以正常显示网站内容了。
现在你就有了自己的博客了。

开始第一篇文章

Hexo会自动帮你把你缩写的 markdown 文件,自动生成静态文件,发布出去,因此你的第一篇文章可以有两种方式来新建

Hexo 的文章存在你安装 Hexo 文件夹的 source 里的_posts 里

利用 Hexo 命令新建

hexo new 输入你的文章标题

输入后,你在_posts 文件夹里自动生成了一个以.md 结尾的 markdown 格式文件,用你喜欢的 markdown 工具开始你的第一篇文章吧

直接在 markdown 工具写完复制到 source/_posts 里

上一个方法是利用命令新建 md,第二种方式就是直接把文件放到对应的文件夹里即可,但是注意,利用命令 hexo new输入文章标题命令新建的文件,会自动按照默认的格式来填写内容,因此通过第二种方式来写文章时,记得把最上面部分复制过来,如下

---
title: Hexo博客搭建完成
date: 2017-11-22 23:51:05
tags: [杂]
categories: [折腾]
---

另外说一下,文章的标记和分类创建问题,可以在写文章时直接填好,如果之前有创建的标签或者分类,会自动被分发到指定类别,如果没有文章内的标签或分类,则会新建此标记或分类。
当文章有多个标签或分类时,可以用这种方式

tags: [标签1,标签2],分类同理。

完毕。

如有问题可以加我微信探讨,二维码在此