Hexo + Github 搭建博客

前期准备工作

1、NodeJs、Github、Git等准备工作请参考

技术小白搭建个人博客 github+hexo

2、本地配置多个ssh key

我们的机器上会有很多的git host,比如公司gitlab、github、oschina等,那我们就需要在本地配置多个ssh key,使得不同的host能使用不同的ssh key ,做法如下(以公司gitlab和github为例)

具体可参考GitLab配置ssh key    GitLab配置ssh key

当配置好后,需要注意的是config文件的配置,按照与下图对应的配置好就可以了。

这是说明样例

这是我自己的config配置

搭建Hexo博客

npm 命令安装hexo

1
npm install -g hexo

创建你的博客项目文件夹

安装完成后,关掉前面那个 Git Bash 窗口。在本地创建一个与 GitHub 上 Repository 中博客项目同名的文件夹(如E:\username.github.io)在文件夹上点击鼠标右键,选择 Git bash here;(username即你注册的github的用户名)

【提示】在进行博客搭建工作时,每次使用命令都要在 E:\username.github.io 目录下。

执行命令

1
hexo init

Hexo 就会自动在 E:\username.github.io 文件夹创建你的博客所需要的所有文件。

安装依赖包

1
npm install

确保git部署

1
2
npm i hexo-deployer-git --save # 通过hexo d 命令将本地改动上传至github上,类似于git push(i 即 install)
npm install hexo-generator-searchdb --save # 搜索功能依赖

本地查看与调试

现在已经搭建好本地的 Hexo 博客了,执行命令

1
2
hexo g # hexo generate
hexo s # hexo server

在浏览器中输入 localhost:4000 即可查看

注意:每进行相应改动都要 hexo g 生成一下然后再 hexo s 启动服务预览,当本地修改和浏览器或者线上不一致时,可以尝试一下 hexo clean 命令,然后再执行上面两个命令

Hexo主题

进入你博客站点的根目录(即上面说的E:\username.github.io目录)找到themes文件夹并打开,鼠标右击 git bash here。把从主题的repository复制的地址复制进去,并回车。

1
git clone git@github.com:iissnan/hexo-theme-next.git

我下载的是next主题,你也可以根据自己的喜好,选择不一样的主题,hexo 主题

然后再站点的根目录下找到_config.yml文件,找到theme,把它更换成与你下载下来的主题的文件夹的名字一致。

如果要对下载的主题进行修改,可以参考next的署名文档,上面有非常详细的说明。hexo-theme-next说明文档

下面是我的站点根目录下_config.yml文件的一些配置(修改主题的配置需要去下载的主题的文件夹下的_config.yml文件中修改)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
# Site
title: Wayne's Blog
subtitle: Welcome to My Blog
description: Like Juices
keywords:
author: Wayne
language: zh-Hans
timezone: Asia/Shanghai

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://weixianpin.github.io
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: hexo-theme-next

# Deployment
## Docs: https://hexo.io/docs/deployment.html
### 这个deploy就是你 github 仓库与本地项目关联的配置
deploy:
type: git
repository: git@github.com:weixianpin/aiheguozhi.github.io.git ### 换成你自己的 GitHub 仓库
branch: master

将博客部署到GitHub上

1
hexo d

博客的图床,即在文章内插入图片

如果把所有的图片都放在本地,最后都推送到GitHub上,这样最后把你的仓库撑爆的,所以我们需要一个存放图片的地方,我用的是七牛云,可见我的这篇博客,里面有关于使用七牛云图床的介绍。

参考文章

施主,打赏请随意~