hexo next 在github上搭建个人博客

前言

目前网上的很多平台都提供了博客功能,如csdn,51cto,cnblog,iteye等等,只要你想写博客,这些平台都可以选择。只需注册个帐号,就可以写博客,实现比较简单,但是局限性也很大,风格千篇一律,没有个性化,扩展也稍麻烦。并且,广告很多,这点很受不了。在此选择了hexo+next+github建立个人的博客平台。

准备

github:https://github.com/dwj999
发布平台:centos6.5 x86_64
发布工具:git
编写平台:windows7 x86_64
编写工具:有道云笔记
框架:hexo
主题:next

安装Node.js

操作系统为centos6.5,首先删除旧版本

1
yum -y remove nodejs

node使用最新版本,下载源码包

1
2
3
wget https://nodejs.org/dist/v8.1.4/node-v8.1.4-linux-x64.tar.xz  
tar -xvJf node-v8.1.4-linux-x64.tar.xz
mv node-v8.1.4-linux-x64 /usr/local/node

配置系统环境变量

1
2
3
4
5
6
vim /etc/profile  
在底部添加 PATH 变量
export PATH=$PATH:/usr/local/node/bin
最后保存并使其生效即可
source /etc/profile
查看版本:node -v

image

安装Git(已安装可跳过)

1
yum install git-core

安装Hexo

这里以我的github为例,地址为:https://github.com/dwj999

1
2
3
4
5
6
7
8
9
10
11
12
创建目录  
mkdir /hwdata/dwj999
切换目录
cd /hwdata/dwj999
安装 Hexo
npm config set user 0
npm config set unsafe-perm true
npm install -g hexo-cli
初始化 Hexo(如果报Error: ENOENT: no such file or directory, uv_cwd,可能是删除的旧版本nodejs导致,重启服务器再试)
hexo init
生成静态网页
hexo generate

安装插件

1
2
3
4
5
6
7
8
9
10
11
12
13
npm install hexo-generator-index --save  
npm install hexo-generator-archive --save
npm install hexo-generator-category --save
npm install hexo-generator-tag --save
npm install hexo-server --save
npm install hexo-deployer-git --save
npm install hexo-deployer-heroku --save
npm install hexo-deployer-rsync --save
npm install hexo-deployer-openshift --save
npm install hexo-renderer-marked --save
npm install hexo-renderer-stylus --save
npm install hexo-generator-feed --save
npm install hexo-generator-sitemap --save

目录结构

1
2
3
4
5
6
7
8
9
10
|-- _config.yml  
|-- db.json
|-- node_modules
|-- package.json
|-- package-lock.json
|-- public
|-- scaffolds
|-- source
|-- _posts
|-- themes

目录结构说明

1
2
3
4
5
6
7
8
9
10
_config.yml #全局配置文件,网站的很多信息都在这里配置,诸如网站名称,副标题,描述,作者,语言,主题,部署等等参数。请参考:https://hexo.io/zh-cn/docs/configuration.html
db.json #缓存文件
node_modules #hexo插件
package.json #hexo框架的参数
package-lock.json #根据package.json自动创建锁定依赖版本,删掉会重新创建
public #生成的静态网页文件
scaffolds #模板文件夹,请参考:https://hexo.io/zh-cn/docs/writing.html
source #资源文件夹,用于存放用户资源。旧版本有两个文件夹,_drafts和_posts。新版本只有_posts,用于存放博客的正文。
themes #网站主题目录,请参考:https://hexo.io/zh-cn/docs/themes.html
详情请参考:请参考:https://hexo.io/zh-cn/docs/setup.html

部署到GitHub

站点配置

修改Hexo站点配置文件/hwdata/dwj999/_config.yml,以下为例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# Site  
title: Jiessie's' Blog #标题
subtitle: 没伞的孩子必须努力奔跑 #副标题
description: 最怕一生碌碌无为,还说平凡难能可贵!
author: Jiessie
language: zh-Hans

url: http://dwj999.github.io

deploy:
type: git
repo: git@github.com:dwj999/dwj999.github.io.git
branch: master
message: '站点更新:{{now("YYYY-MM-DD HH/mm/ss")}}'

github创建项目

仓库的名字必须和你的帐号对应,比如我的github地址:https://github.com/dwj999 新建仓库名为dwj999.github.io,因我的项目已创建,此为演示,故有提醒,可忽略
image

git配置

1
2
3
git config --global user.email "dwj999@163.com" 
git config --global user.name "dwj999"
ssh-keygen -t rsa -C "dwj999@163.com" #一路回车,如已生成过,可覆盖成功后会~/.ssh目录生成key,复制id_rsa.pub内容

添加key

image

打开github地址:https://github.com/settings/ssh,打开ssh keys,添加key
image

代码上传

1
2
3
4
# linux编译
hexo generate
# 在主机的hexo目录下 执行以下命令将自动更新到Github
hexo d

站点访问,左面菜单和主题已经配置过

image

主题和配置文件

切换到站点目录,下载主题代码

1
2
cd /hwdata/dwj999
git clone https://github.com/iissnan/hexo-theme-next themes/next #主题的配置文件,位于 hexo/theme/next/_config.yml

配置主题

1
2
3
4
vim _config.yml
# 找到theme:修改后面的参数,默认是landscape
theme: next
hexo d -g #重新编译,上传

主题和第三方服务说明
官方文档很详情
请参考:
http://theme-next.iissnan.com/getting-started.html
http://theme-next.iissnan.com/theme-settings.html
http://theme-next.iissnan.com/third-party-services.html

发布文章

由于hexo支持markdown写文章,并且我使用的是windows机器,代码发布在linux机器上,所以选择了有道云笔记的markdown笔记来写文章,虽然语法支持有缺陷,但是以前习惯了使用有道云,没有使用其他工具,像Cmd Markdown的在线编辑器也不错。

1
hexo new "hexo next 在github上搭建个人博客" #创建了一个博客文章

image
再使用有道云的markdown进行写文章,写好后,导出,上传到github。

-------------本文结束感谢您的阅读-------------