hexo和GitHub搭建个人博客!

作者: aaadsgfh | 来源:发表于2019-02-21 19:04 被阅读292次

Hexo+github搭建个人博客－博客发布篇
Hexo+Github搭建个人博客
Hexo+GitHub 搭建个人博客（一）：安装、配置和第一篇博
通过GitHub和Hexo来搭建自己的个人博客 2019-01-
hexo和github搭建个人博客
Hexo+GitHub 搭建个人博客（二）：更改博客主题、上传源
Ubuntu 18.04 LTS 配置 Hexo
Hexo 高级设置
基于github的hexo博客的搭建
Mac上搭建基于GitHub的Hexo博客

前言

本文在我的博客:https://xecades.xyz/2019/02/22/BuildBlog/
由于版本更新缘故，2018年及以前的hexo博客搭建教程都对当前不适用，为了防止误导想搭建个人博客的小白，我总结并修改了网上部分搭建教程，内容如有不当请联系我，谢谢！

搭建GitHub仓库

注册GitHub

GitHub是一个面向开源及私有软件项目的托管平台，官网地址，因为只支持git作为唯一的版本库格式进行托管，故名GitHub。注册GitHub仓库用于存储你的博客，其实还可以用其他仓库，我还是推荐用GitHub。
注册过程很简单，我草草过一下(我创建名为waterdrop100的账号用于演示)。

注册方法

注册后还需要验证，它会给你的邮箱发一个链接，打开链接完成验证。

创建仓库

注册好后，单击左边提示栏的"Create a repository"，创建仓库。

在"Repository name"栏里按用户名.github.io的格式填入，比如我应该填waterdrop100.github.io。

其他的不用填，直接点"Create repository"，GitHub仓库创建完成！等待半个小时仓库才会生效。

搭建环境

下载node.js和git

下载链接:node.js,git。

node.js和git的安装很简单，网上资料很多，我就不多赘述了。

最好验证一下安装是否成功。打开cmd，输入node -v、npm -v和git --version，若输出正常则配置成功。

配置成功!

安装hexo

找一个你觉得安全好的地方新建文件夹用于存储本地博客，最好不要在系统盘(C盘)建。我再E盘建了一个blog文件夹，再用cmd进入。

进入文件夹

再输入npm install hexo -g安装hexo。

输入hexo -v，若输出版本信息，则安装成功。输入hexo init初始化文件夹(慢慢等)。

更进一步

输入npm install安装插件.

安装插件

至此hexo安装完毕。

体验hexo

如果你想看一下成果，那继续往下看。
输入hexo g更新文件，再输入hexo s开启本地测试用服务器。

体验一下!

在浏览器中输入网址http://localhost:4000预览你的博客！页面默认如下(hexo默认创建了名为Hello World的文章)

默认页面

连接hexo和GitHub

设置git用户名和邮箱

在博客目录(我的是E:/blog)右键，选择Git Bash Here，输入git config --global user.name "你注册GitHub的用户名"，设置git的用户名。

输入git config --global user.email "你注册GitHub的邮箱"，设置git的邮箱。

设置用户名和邮箱

配置ssh

采用ssh加密传输，防止信息被窃。

下面的教程适用于用户目录下没有.ssh文件夹的读者，如果有且有2个文件(id_rsa、id_rsa.pub)，则可以直接跳过此节。

在git中输入ssh-keygen -t rsa -C "你的邮箱"，显示如下

git的显示

输入eval "$(ssh-agent -s)"将密钥添加到ssh-agent。

再输入ssh-add ~/.ssh/id_rsa(我不知道是干啥用的，这样输就对了…)。

效果

打开GitHub，单击头像，选择settings，再选择SSH and GPG keys

打开settings

选择SSH and GPG keys

选择New SSH key，新建ssh key，粘贴用户目录下.ssh文件夹中id_rsa.pub文件的内容。

SSH key

在git中输入ssh -T git@github.com，输入yes，若显示大概如下，则标准ssh配置成功。

配置成功!

配置_config.yml

在博客文件夹中有一个文件叫_config.yml，它是博客核心配置，用编辑器打开，在文件末尾有如下内容。

_config.yml

将其修改为如下格式(注意，在每一个":"后都必须有一个空格)

deploy:
  type: git
  repository: git@github.com:你的GitHub用户名/你的GitHub用户名.github.io.git
  branch: master

其中repository一项是GitHub仓库页面的ssh地址。

repository

完成连接

现在GitHub和本地文件夹已经连接好了，下面讲解本地上传到GitHub的方法

打开cmd，安装扩展:npm install hexo-deployer-git --save。

先hexo clean清一下缓存。

输入hexo d -g生成+部署，这个命令很重要，以后每次对博客有更改都要上传部署。

生成部署

等个几分钟，你的网页就可以访问了，地址是GitHub用户名.github.io，比如我的是waterdrop100.github.io。

发布文章

有了博客还不会发布文章怎么行呢，下面来讲如何发布文章。文章一般在主页显示，就是你日常写博客的文章啦！

在cmd中输入hexo new 文章名就会在source\_posts目录下创建一个名为文章名.md的文件，推荐用VScode打开，用markdown继续编辑。

新建名为article的文章

在文件开头有如下几行字:

---
title: article　　　　　　　//文章名
date: 2019-02-21 07:32:26　//创建时间
tags:　　　　　　　　　　　　//标签
---

这些是此文章的配置，后面可以增添删改一些内容。

配置文件

前面说过_config.yml是重要的配置文件，下面对其内容进行简要讲解。

# 字前面加"#"的是注释
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: Hexo # 网站主标题，可改
subtitle: # 网站副标题，可改
description: # 站点描述
keywords: # 在搜索引擎搜索到的关键词
author: John Doe # 博主名字，可改
language: # 语言
timezone: # 时区

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com # 站点地址
root: / # 主页位置
permalink: :year/:month/:day/:title/ # 日期显示方式
permalink_defaults:

# Directory
# 以下内容默认即可
source_dir: source 
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # 新文章的名称
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # 在新页面打开第三方链接
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight: # 高亮设置
  enable: true #是否启用
  line_number: true # 行号
  auto_detect: false # 自动检测代码语言
  tab_replace: # 替换Tab
  
# 主页设置
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date
  
# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# 日期/时间格式化
## Hexo用Moment.js插件来分析和显示日期
## 可以使用在以下网站定义的格式化类型
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD # 日期类型
time_format: HH:mm:ss # 时间类型

# 分页设置
## 把per_page设置成0来关闭分页
per_page: 10 # 每页显示文章数量
pagination_dir: page

# 扩展
## 插件下载地址: https://hexo.io/plugins/
## 主题下载地址: https://hexo.io/themes/
theme: landscape # 主题默认是landscape，后面教如何修改

# 部署
## 文档教程: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repository: git@github.com:waterdrop100/waterdrop100.github.io.git
  branch: master

尾声

经过一番折腾，博客终于配置好了，但默认的页面不是很好看，我后面会写文章来讲解进一步的美化，让您的博客更个性化。
要弄好一个自己的博客，不是一蹴而就的，希望大家有耐心，当初寒假的时候，我也是一个什么都不懂的小白(~~现在也是~~)，按照网上的教程蹒跚学步似地用了很长时间做了一个属于自己的博客，高兴之余，摆在我面前的确是不计其数的bug。我于是抱着一颗虔诚的心，勤能补拙，才有了现在的博客
我也不想也不会虚张声势，能把自己的一份爱好(我是学信息学竞赛的)弄到自己满意的程度，我完全有脸面也有资格停下来，小憩一下，把初三没看的十余部电影看完，但我不想，我厌烦这种孤独享乐的日子，这样的生活还会有什么价值？我知道，也希望我的读者也一样，像朱光潜所说：朝着抵抗力最大的方向前进！
对不起有点偏题，只是希望大家能坚持下来，坚持自己的爱好
因为现在我初三学业重，下一篇进阶文章的更新可能在很久之后了(真的很久，暑假吧)，请谅解。

编辑此文章我查阅的资料: