前言

其实很早就在github通过hexo静态页面搭建过博客,在前段时间购买了云服务器并搭建了另一套博客的时候打算两边同时建设。当时考虑到由于github在海外的原因,于是准备转投国内的码云gitee平台。在搭建过程中发现使用静态页面还需要手持身份证验证,着实有些麻烦,故继续使用github进行搭建。

安装环境与工具

下载安装Typoya

下载地址:

https://ioufev.lanzout.com/iA5J10945l8d

下载安装git

下载地址:

https://git-scm.com/downloads

下载安装node.js

下载地址:

https://nodejs.org/en

检查是否安装成功

1
2
3
4
#检查node.js是否安装成功
node -v
#检查npm是否安装成功
npm -v

img

连接github

注册github账户:

https://github.com/

右键 -> Git Bash Here,设置用户名和邮箱:

git config --global user.name "Github 用户名"
git config --global user.email "Github 邮箱"

生成SSH公钥并添加到gitee,实现免密码登录

ssh-keygen -t rsa -C "Github 邮箱"

登陆 GitHub ,进入 Settings 页面,选择左边栏的 SSH and GPG keys,点击 New SSH key。

Title 随便取个名字,粘贴复制的 id_rsa.pub 内容到 Key 中,点击 Add SSH key 完成添加。打开 Git Bash,输入 ssh -T git@github.com 出现 “Are you sure……”,输入 yes 回车确认。

如果报错是因为我们之前登使用其他的SSH的key登陆过github,这里运行代码删除相关rsa的信息即可。

ssh-keygen -R github.com

img

再次运行

ssh -T git@github.com

img

显示 “Hi xxx! You’ve successfully……” 即连接成功。

HEXO安装

全局安装hexo

npm install hexo-cli -g

使用hexo -v,查看是否安装成功

hexo -v

img

创建本地博客站点

# 初始化一个项目,crux92.github.io 是项目名

hexo init crux92.github.io

img

  1. 进入hexoblog项目目录

    cd crux92.github.io

  2. 安装 hexoblog 项目的依赖包

    npm install

  3. 启动 hexoblog 项目服务

    hexo s

此时,访问 http://localhost:4000/ 即可看到 hexo 默认的页面和一篇“Hello World”默认生成的文章。

项目主要文件目录介绍

1
2
3
4
5
6
7
8
9
10
11
.
├── .deploy # 需要部署的文件
├── node_modules # 项目所有的依赖包和插件
├── public # 生成的静态网页文件
├── scaffolds # 文章模板
├── source # 博客正文和其他源文件等都应该放在这里
| ├── _drafts # 草稿
| └── _posts # 文章
├── themes # 主题
├── _config.yml # 全局配置文件
└── package.json # 项目依赖信息

修改主题

可以去https://hexo.io/themes/搜索。

这里我之前使用的是yun主题。地址:

https://github.com/YunYouJun/hexo-theme-yun

下载解压到themes目录,将_config.yml中的theme:改成theme: yun(与themes文件夹内主题文件夹名一致)

这里本来想使用最新的yun主题,但是出了点问题,懒得改配置了,就还是使用多年前的主题。而主题的具体内容可以进入到source/_data/yun.yml进行修改。

图床

这里我们使用PicG+SM.MS的形式

PicGo下载地址:

https://github.com/Molunerfinn/picgo/releases

SM.MS注册地址

https://sm.ms/

注册完毕后在User-Dashboard获取API token

img

在PicGo中设置即可

img

在Typora设置中设置好上传服务选项,即可使用

img

写你的第一篇博文

现在,你就可以在博客目录的source/_posts目录下面,添加你自己的博客文章了:文件名设为“文章标题.md”(注意后缀名),复制下面的模板内容到编辑框里面,写好你想写的内容,保存即可。现在回到你的博客主页面,多刷新几次,你的第一篇博客就能出现了!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
---
layout: post
title: (文章标题)
subtitle: (副标题)
date: 2018-12-01
author: (作者名)
header-img: img/the-first.png
catalog: true
tags:
- 往事如烟
categories: 笔记
---
# 一级标题
## 二级标题
(正文内容)

推荐使用

hexo new "文章标题"

再进入该文件进行编写和修改

将项目部署到Github

  1. GitHub 主页左边的New,Repository name填写用户名.github.io

创建后默认自动启用 HTTPS,博客地址为:https://用户名.github.io

  1. 在项目根目录下安装git部署插件,之后就可以使用 hexo deploy(或简写 hexo d)将项目部署到gitee远程仓库。

    npm install hexo-deployer-git --save

由于这里使用了旧版的博客,要用npm fix –force修复一下

npm fix --force

  1. 修改项目配置文件:_config.yml,在最下面,修改如下内容

img

  1. 使用命令 hexo d 将项目部署到 gitee 远程仓库

    1
    2
    3
    4
    5
    6
    7
    8
    #生成静态网站文件
    hexo g
    #上传到远程仓库
    hexo d
    #清除 hexo 的缓存
    hexo clean
    #采用一键部署
    hexo g --d