Hexo+GitHub搭建博客

264 阅读3分钟

前言

第一次使用Hexo搭建博客,前前后后遇到了很多问题,在这里总结一下,希望对大家有帮助。

我们需要?

要搭建Hexo,我们需要这些东西

  1. Github账号
  2. git
  3. Node.js和npm

Github

注册账号这里就不多说了,邮箱注册即可。重点说一下创建仓库。

点击右上角的 + 加号,选择 New repository

选择新建仓库

接着输入仓库名,要搭建Hexo,名称必须是用户名.github.io,比如我的用户名是cyxil,那么我的仓库名应该为cyxil.github.io,之后我们会用这个名字作为域名访问。

新建仓库

点击 Create repository 即可完成创建

git

这篇文章就不介绍git是什么了,直接安装。由于官网安装较慢,我们选择淘宝镜像:git安装地址

选择最新的版本下载,之后除了路径,一切默认即可。

安装成功后,右键菜单会出现Git Bash Here选项,之后我们大部分命令都会在这里运行。

Git安装成功

Node.js

Node.js安装也很简单,到官网下载对应版本,一直下一步即可,这一步会同时安装好npm。

Node.js安装地址

测试一下

打开cmd,分别输入node -v和npm -v,如果出现版本号,说明安装成功

测试node&npm

Hexo

通过上面的操作,我们已经安装好了所有需要的东西,接下来开始重头戏。

安装

首先创建一个文件夹,随便叫什么都好,用来存放我们的博客。

进入这个文件夹,右键打开Git Bash Here(之后简称Git),输入以下命令全局安装Hexo。

npm install -g hexo

初始化

全局安装好后,我们可以在任何位置去初始化Hexo,还是在刚刚创建的文件夹下,在Git中输入以下命令。

hexo init

初始化完毕,你的文件夹下会多出这些文件以及目录。

hexo初始化

本地运行

这里我们会用到三个命令,分别是hexo clean、hexo g和hexo s

hexo clean表示 清除缓存文件 和 已生成的静态文件。

hexo g表示 生成静态文件 ,也就是生成博客页面。

hexo s表示 本地启动,启动成功后,浏览器 访问 localhost:4000 即可看到默认的博客 ,Ctrl+c可以关闭。

本地运行

建议在每次 hexo g 前,都执行一次hexo clean。

这里可能会出现端口被占用的情况, 结束相应进程即可。

上传

在上传之前,我们还需要进行一些配置。

配置Git

Git命令行中输入以下命令

git config --global user.name "你的昵称"
git config --global user.email "你的邮箱"

Github配置SSH

继续在Git命令行中操作

ssh-keygen -t rsa -C "上一步输入的邮箱" 

之后按三次回车,会生成id_rsa.pub文件,路径在第二行 Enter file in which to save the key 后的括号里。

生成SSH

用任意一个代码编辑器打开这个文件,复制里面的内容.

然后打开Github->Settings->SSH and GPG keys,点击New SSH key

配置SSH

配置SSH

接着把刚刚文件中的内容复制到Key中,点击Add SSH key

配置SSH

安装插件

在Git命令行中运行

npm install hexo-deployer-git --save

不安装会导致报错。

_config.yml 配置

用代码编辑器打开博客根目录下的_config.yml文件,找到 deploy ,改成下面的格式。

deploy:
  type: git
  repository: Github路径
  branch: master

Github路径在哪呢?

打开Github下刚刚创建的仓库(xx.github.io),有一个绿色的按钮 Clone or download,点击会看到 git@github开头的路径,复制到 repository 后面

其他配置大家可以参考Hexo文档设置 Hexo文档

这里要注意的是,_config.yml中,冒号后面必须有空格!切记!

上传

准备工作完毕,接下来我们开始上传,这里也是三个命令。

清除缓存:hexo clean

生成页面:hexo g

上传:hexo d

成功的话,你的仓库中会新增一些文件,接着访问 https://你的仓库名,有页面就说明Hexo部署成功了。

切记,一定要先hexo clean和hexo g。