作为本Blog的第一篇文章,我们先将Hexo的搭建过程详细记录一下(以表尊敬)!在搭建过程中也遇到了不少问题,有一些解决方法的资料也因为时间久远的版本问题失效,坑还是较多,所以尽量详细的、尽我所能的去写Hexo的系列教程,本系列教程将分为N篇,后续笔者发现新的功能/找到新的Bug/发现新的办法也会持续在这个系列下加更/修改(但愿如此)!


第一部分:利用Github进行Hexo的搭建

Hexo的搭建对前端代码要求极低,准确的讲基本不需要,但这个配置过程中会出现奇奇怪怪的问题,所以仔细阅读官方文档不失为一种好方法

本篇概述

  1. 安装Git
  2. 安装Node.js
  3. 安装Hexo
  4. GitHub创建个人仓库
  5. 生成SSH添加到GitHub
  6. 将hexo部署到GitHub

名词简介

  • Hexo:
    • Hexo是一款基于Node.js的静态博客框架,依赖少易于安装使用,可以方便的生成静态网页托管在GitHub和Coding上,是搭建博客的首选框架。
  • Git:
    • Git是目前世界上最先进的分布式版本控制系统,可以有效、高速的处理从很小到非常大的项目版本管理。也就是用来管理你的hexo博客文章,上传到GitHub的工具。
    • 对于Git部分,本博客将会陆续上传对于Git使用、管理以及冲突处理的相关内容
    • Git下载网址:https://gitforwindows.org/
  • SSH:
    • 安全外壳协议(Secure Shell,简称SSH)是一种在不安全网络上用于安全远程登录和其他安全网络服务的协议。SSH由IETF的网络小组(Network Working Group)所制定;SSH 为建立在应用层基础上的安全协议。SSH 是较可靠,专为远程登录会话和其他网络服务提供安全性的协议。利用 SSH 协议可以有效防止远程管理过程中的信息泄露问题。
  • Github:
    • GitHub是一个面向开源及私有软件项目的托管平台,因为只支持Git作为唯一的版本库格式进行托管,故名GitHub。GitHub拥有1亿以上的开发人员,400万以上组织机构和3.3亿以上资料库。

Git安装

在git安装完成之后,可以使用:

git --version

若出现下图,则代表安装成功:

安装NodeJS

Hexo是基于nodeJS编写的,所以需要安装一下nodeJs和里面的npm工具。同样的,官网直接安装即可:

  • NodeJS官网:https://nodejs.org/zh-cn
  • 同样的,为了验证是否安装成功,我们可以分别运行一下:
node --version
npm --version
  • 出现下图代表安装成功:

安装Hexo

进入命令行执行:

npm install -g hexo-cli

执行完成后,依旧执行hexo --v来查看是否全部安装完成。

Github创建仓库

在这里, 我默认你已经拥有Github账号!

  • 首先创建一个Public仓库
  • 仓库名必须为{Name}.github.io({Name}替换为自己的仓库名)
  • 比如我创建一个名为TEST仓库:

生成SSH添加到Github

  • 如果你是首次安装Git并准备进行Github的代码托管操作,那么需要进行Git的全局设置:
git config --global user.name "yourname"
git config --global user.email "youremail"
  • 这里的yourname输入你的GitHub用户名,youremail输入你GitHub的邮箱。这样GitHub才能知道你是不是对应它的账户。输入后如果想查看自己的设定,输入:
git config user.name
git config user.email
  • 进行SSH的创建:
ssh-keygen -t rsa -C "youremail"
  • 一直点回车直到结束就可以
  • 会生成两个密钥:id_rsa是这台电脑的私人秘钥,id_rsa.pub是公共秘钥,我们需要把id_rsa.pub公共秘钥放到Github上。
  • 生成的SSH密钥存放在C:\Users\{用户名}\.ssh文件夹下,fuzhi id_rsa.pub的内容:
  • 粘贴到Settings-SSH keys下
  • 新建一个SSH-Key

将hexo部署到GitHub

到现在,我们的准备工作已经完全就绪,接下来就可以进行站点的正式配置!

  • 在我们准备好的文件夹中,我们以C:/TEST为例:
  • 分别执行下述几个命令
cd C:/TEST //进入工作文件夹
hexo init myblogname //初始化hexo
npm install
  • 新建完成后,指定文件夹会有以下文件夹:
- node_modules: 依赖包
- public:存放生成的页面
- scaffolds:生成文章的一些模板
- source:用来存放你的文章
- themes:主题
- ** _config.yml: 博客的配置文件**
  • 打开_config.yml文件,在最后进行修改
    • 在这里的repo需要填写的是ssh地址,若为http,则会出现未知错误!
deploy:
type: git
repo: git@github.com:{githubname}/{githubreponame}.git
branch: master
  • 填写完成后,需要安装depoly-git,这是一个部署命令,这样才可以用命令部署到Github。
npm install hexo-deployer-git --save
  • 下载完成后,依次运行下述命令:
hexo clean  //清除之前生成的缓存
hexo g //生成静态文章
hexo s //打开hexo的服务,在浏览器输入localhost:4000就可以看到你生成的博客了
hexo d //部署文章,注意deploy时可能要你输入username和password
  • 出现下图说明部署成功,等待一小会,就可以在http://{yourname}.github.io这个网站查看你的博客了!

  • 下篇预告:
  • 下一篇我们将介绍如何在阿里云购买个人域名!并进行一系列配置,使用自定义域名打开自己的博客!