Hexo搭建个人博客系统

2015-09-01 Hexo Hexo 0 评论字数统计: 4.7k(字) 阅读时长: 19(分)

什么是 Hexo？

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

系统环境

Distributor ID: CentOS
Description: CentOS Linux release 7.6.1810 (Core)
Release: 7.6.1810
CPU: 2 Core
内存容量: 2G
Git Version: 1.8.3.1
Nvm Version: 0.34.0
Node.js Version: v12.10.0
Npm Version: 6.11.3
Hexo Version: 3.9.0
Hexo-cli Version: 2.0.0

环境准备

安装Git

Linux (CentOS):

1	# sudo yum -y install git-core

安装 Node.js

安装 Node.js 的最佳方式是使用 nvm。nvm 的开发者提供了一个自动安装 nvm 的简单脚本：

安装nvm

Curl:

1	# curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh \| sh

或Wget:

1	# wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh \| sh

使用nvm安装node

安装完成后，重启终端并执行下列命令即可安装 Node.js。

1	# nvm install node

搭建Hexo博客系统

安装Hexo

Node 和 Git 都安装好后，可执行如下命令安装 Hexo：

1	npm install -g hexo-cli

初始化Blog目录

然后，执行 init 命令初始化 Hexo 到你指定的目录：

1
2
3

# hexo init <folder>
此处我们在用户家目录下的blog目录进行初始化
# hexo init blog

也可以 cd 到目标目录，执行 hexo init。

安装Hexo依赖包

初始化完成后，cd进入该初始化的目录blog下，使用npm安装Hexo对应的依赖包。

1 2	# cd blog # npm install

好啦，至此，全部安装工作已经完成！

更换Hexo主题

本文以 hexo-theme-pure 主题为例，安装主题的方法就是一句 git 命令：

在终端命令行窗口下，切换到 Hexo 站点目录blog目录下。使用 Git checkout 代码：

1 2	# cd blog/theme # git clone https://github.com/Eddieeo/hexo-theme-pure.git themes/hexo-theme-pure

安装完成后，打开Hexo站点目录blog的配置文件_config.yml，修改主题为 hexo-theme-pure

1	theme: hexo-theme-pure

打开 blog/themes/hexo-theme-pure 目录，编辑主题配置文件_config.yml，修改自己想要的配置：

# menu
menu:
  Home: .
  Archives: archives  # 归档
  Categories: categories  # 分类
  Tags: tags  # 标签
  Repository: repository  # github repositories
  Books: books  # 豆瓣书单
  Links: links  # 友链
  About: about  # 关于

# Enable/Disable menu icons
menu_icons:
  enable: true  # 是否启用导航菜单图标
  home: icon-home-fill
  archives: icon-archives-fill
  categories: icon-folder
  tags: icon-tags
  repository: icon-project
  books: icon-book-fill
  links: icon-friendship
  about: icon-cup-fill

# rss
rss: /atom.xml

主题其它使用配置及常见问题点此：主题hexo-theme-pure使用文档

更新主题

切换到Hexo站点blog的主题hexo-theme-pure目录下

1 2	cd blog/themes/hexo-theme-pure git pull

写文章

使用系统默认编辑器vim编写Markdown文档

执行 new 命令，生成指定名称的文章至 blog/source/_posts/postName.md。

1	hexo new [layout] "postName" # 新建文章

其中 layout 是可选参数，默认值为 post。有哪些 layout 呢，请到 scaffolds 目录下查看，这些文件名称就是 layout 名称。当然你可以添加自己的 layout，方法就是添加一个文件即可，同时你也可以编辑现有的 layout，比如 post 的 layout 默认是 blog/scaffolds/post.md

---
title: { { title } }
date: { { date } }
tags:
---

请注意，大括号与大括号之间我多加了个空格，否则会被转义，不能正常显示。

我想添加 categories，以免每次手工输入，只需要修改这个文件添加一行，如下：

---
title: { { title } }
date: { { date } }
categories: 
tags: 
---

postName 是 md 文件的名字，同时也出现在你文章的 URL 中，postName 如果包含空格，必须用 ’ ’ 将其包围，postName 可以为中文。

注意：所有文件，开头要遵循YAML文件格式，即冒号: 后面都必须有个空格，不然会报错。

看一下刚才生成的文件 hexo/source/_posts/postName.md，内容如下：

---
title: postName #文章页面上的显示名称，可以任意修改，不会出现在URL中
date: 2013-12-02 15:30:16 #文章生成时间，一般不改，当然也可以任意修改
categories: #文章分类目录，可以为空，注意:后面有个空格
tags: #文章标签，可空，多标签请用格式[tag1,tag2,tag3]，注意:后面有个空格
---
这里开始使用Markdown格式输入你的正文。

使用Windows上的图形编辑器Typora编写Markdown文档

在Windows上安装软件Typora，开始编写Markdown文档，注意Markdown文档的开头必须有以下内容：

---
title: postName #文章页面上的显示名称，可以任意修改，不会出现在URL中
date: 2013-12-02 15:30:16 #文章生成时间，一般不改，当然也可以任意修改
categories: #文章分类目录，可以为空，注意:后面有个空格
tags: #文章标签，可空，多标签请用格式[tag1,tag2,tag3]，注意:后面有个空格
---
这里开始使用Markdown格式输入你的正文。

将编写好的文档上传到Hexo服务器上的站点blog目录下的source/_post目录下，然后重启Hexo服务即可。

关于Markdown 语法说明可以参考该链接：Markdown语法说明文档。

Hexo 中所有文件的编码格式均是 UTF-8。

本地前台启动Hexo

执行如下命令，启动本地服务，进行文章预览调试。

1	# hexo server # 简写命令 hexo s

打开浏览器测试访问前，先禁用系统自带的防火墙firewalld和SELinux服务，执行如下命令

# systemctl stop firewalld.service
# systemctl disable firewalld.service
# setenforce 0
# sed -i 's#SELINUX=enforcing#SELINUX=disabled#g' /etc/selinux/config

浏览器输入 http://IPADDRESS:4000 就可以看到效果，如下图所示：

注：IPADDRESS，请使用ifconfig命令在服务器上查看

PM2工具管理Hexo开机自启且后台运行

安装PM2管理Hexo后台运行

使用npm包管理器安装pm2工具

1	# npm install -g pm2

在Hexo的初始化目录blog目录下，添加一个名叫 hexo_run.js 的脚本，脚本内容如下：

//this is a json script,be used for run hexo backstage
//run
const { exec } = require('child_process')
exec('hexo server',(error, stdout, stderr) => {
        if(error){
                console.log('exec error: ${error}')
                return
        }
        console.log('stdout: ${stdout}');
        console.log('stderr: ${stderr}');
})

使用以下命令可以使hexo在后台运行

1
2
3

# pm2 start hexo_run.js      # 启动Hexo
# pm2 stop hexo_run.js       # 停止Hexo
# pm2 restart hexo_run.js    # 重启Hexo

PM2设置开机自启动

# pm2 save     # 保存当前pm2进程状态
# pm2 startup  # 生成开机自启动命令
# systemctl start pm2-root.service    # 启动pm2-root.service服务
# systemctl enable pm2-root.service   # 设置pm2-root.service开机自启

部署静态页面到Github Pages 或 Coding Pages

注册申请GitHub用户或Coding用户

GitHub用户和Coding用的注册，此处不做介绍，自行百度解决。

配置SSH连接Github或Coding

添加 SSH-Key

首先设置你的用户名和邮箱地址：

1 2	# git config --global user.name "username" # git config --global user.email "email@example.com"

生成密钥

1	# ssh-keygen -t rsa -C "email@example.com"

想简单，过程一路回车。

# ssh-keygen -t rsa -C "your_email@youremail.com"    你的email帐户
Generating public/private rsa key pair.
Enter file in which to save the key (/c/Documents and Settings/Administrator/.ssh/id_rsa): （设置保存公钥和私钥的位置，保持默认，可以不填直接回车）
Enter passphrase (empty for no passphrase): （读取id_rsa的密码，可不填，不过建议填写）
Enter same passphrase again: （再次输入id_rsa密码确认）
Your identification has been saved in /c/Documents and Settings/Administrator/.ssh/id_rsa.
Your public key has been saved in /c/Documents and Settings/Administrator/.ssh/id_rsa.pub.
The key fingerprint is:生成的KEY 你的email帐户

上述命令若执行成功，会在 /root/.ssh/ 目录下生成两个文件 id_rsa 和 id_rsa.pub。

添加ssh密钥到Github

在命令行用cat命令读取 id_rsa.pub 文件，拷贝其中的内容，登录Github，找到settings—>SSH and GPG keys—>New SSH key，将公钥粘贴到弹出的Key对话框中，并输入Title；然后单击Add SSH key ，完成SSH密钥添加，如下图所示。

最后，在Hexo服务器命令行界面可以验证一下：

1	# ssh -T git@github.com

顺利的话可以看到下面的信息，第一次使用SSH连接Github，会提示你确认连接，输入yes即可。

The authenticity of host ‘github.com (52.74.223.119)’ can’t be established.
RSA key fingerprint is SHA256:nThbg6kXUpJWGl7E1IGOCspRomTxdCARLviKw6E5SY8.
RSA key fingerprint is MD5:16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added ‘github.com,52.74.223.119’ (RSA) to the list of known hosts.
Hi Eddieeo! You’ve successfully authenticated, but GitHub does not provide shell access.

添加ssh密钥到Coding

在命令行用cat命令读取 id_rsa.pub 文件，拷贝其中的内容，登录Coding，找到个人设置—>SSH公钥—>新增公钥，将公钥粘贴到弹出的公钥内容对话框中，并输入公钥名称，修改公钥有效期；然后单击添加，完成SSH密钥添加，如下图所示。

最后，在Hexo服务器命令行界面可以验证一下：

1	# ssh -T git@e.coding.net

顺利的话可以看到下面的信息，第一次使用SSH连接Coding，会提示你确认连接，输入yes即可。

The authenticity of host ‘e.coding.net (118.126.70.252)’ can’t be established.
RSA key fingerprint is SHA256:jok3FH7q5LJ6qvE7iPNehBgXRw51ErE77S0Dn+Vg/Ik.
RSA key fingerprint is MD5:98🆎2b:30:60:00:82:86:bb:85:db:87:22:c4:4f:b1.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added ‘e.coding.net,118.126.70.252’ (RSA) to the list of known hosts.
Coding 提示: Hello eddieeo, You’ve connected to Coding.net via SSH. This is a personal key.
eddieeo，你好，你已经通过 SSH 协议认证 Coding.net 服务，这是一个个人公钥

部署到Github Pages

创建代码仓库

使用上面注册的用户登录Github官网，然后点击首页的 Start a project 按钮，创建一个公开的代码仓库，如下图所示，其中Repository name 一定要填写成 username.github.io，username就是你Github的登录用户名。

修改Hexo站点配置文件_config.yml

修改博客站点的配置文件_config.yml，将deploy的配置修改为如下:

deploy:
  type: git
  repository: git@github.com:Eddieeo/eddieeo.github.io.git
  branch: master

生成静态页面

cd 到你的Hexo站点的初始化目录blog下，清除上次生成静态页面留下的缓存，执行如下命令：

1	# hexo clean # 清除缓存网页正常情况下可以忽略此条命令

然后执行如下命令，生成静态页面至当前路径下的 public 目录。

1	# hexo generate # 生成静态页，简写命令 hexo g

命令必须在站点目录下执行，否则不成功，但是也不报错。
当你修改文章 Tag 或其他内容时，不能正确重新生成内容，可以删除 hexo\db.json 后重试，还不行就到 public 目录删除对应的文件，重新生成。

发布到Github Pages

前提：要想通过git部署，必须确保Hexo站点目录下有安装 hexo-deployer-git 插件，可以在Hexo站点目录下执行以下命令安装该插件

1	# npm install hexo-deployer-git --save

然后cd 到你的Hexo站点的初始化目录blog下，执行如下命令进行发布

1	# hexo deploy # 简写命令 hexo d

看到类似如下图所示的返回，即表示发布成功。

部署到Coding Pages

创建代码仓库

使用上面注册的用户登录Coding官网，然后点击首页的全部项目按钮，创建一个私有的项目，如下图所示，其中项目名称任意填写。

修改Hexo站点配置文件_config.yml

修改博客站点的配置文件_config.yml，将deploy的配置修改为如下:

deploy:
  type: git
  repository:  git@e.coding.net:itunion/blog.git
  branch: master

生成静态页面

cd 到你的Hexo站点的初始化目录blog下，清除上次生成静态页面留下的缓存，执行如下命令：

1	# hexo clean # 清除缓存网页正常情况下可以忽略此条命令

然后执行如下命令，生成静态页面至当前路径下的 public 目录。

1	# hexo generate # 生成静态页，简写命令 hexo g

命令必须在站点目录下执行，否则不成功，但是也不报错。
当你修改文章 Tag 或其他内容时，不能正确重新生成内容，可以删除 hexo\db.json 后重试，还不行就到 public 目录删除对应的文件，重新生成。

发布到Coding Pages

前提：要想通过git部署，必须确保Hexo站点目录下有安装 hexo-deployer-git 插件，可以在Hexo站点目录下执行以下命令安装该插件

1	# npm install hexo-deployer-git --save

然后cd 到你的Hexo站点的初始化目录blog下，执行如下命令进行发布

1	# hexo deploy # 简写命令 hexo d

看到类似如下图所示的返回，即表示发布成功。

开启静态网站

登录Coding网站，进入到blog项目，设置开启静态网站。

同时部署到Github Pages和Coding Pages

创建代码仓库

分别在Github Pages和Coding Pages新建好仓库和项目，此步骤可以参考前面的内容。

修改Hexo站点配置文件_config.yml

修改博客站点的配置文件_config.yml，将deploy的配置修改为如下:

deploy:
  type: git
  repo:
    github: git@e.coding.net:itunion/blog.git,master
    coding: git@github.com:Eric-Cai/Eric-Cai.github.io.git,master

生成静态页面

cd 到你的Hexo站点的初始化目录blog下，清除上次生成静态页面留下的缓存，执行如下命令：

1	# hexo clean # 清除缓存网页正常情况下可以忽略此条命令

然后执行如下命令，生成静态页面至当前路径下的 public 目录。

1	# hexo generate # 生成静态页，简写命令 hexo g

命令必须在站点目录下执行，否则不成功，但是也不报错。
当你修改文章 Tag 或其他内容时，不能正确重新生成内容，可以删除 hexo\db.json 后重试，还不行就到 public 目录删除对应的文件，重新生成。

同时发布到Github Pages和Coding Pages

前提：要想通过git部署，必须确保Hexo站点目录下有安装 hexo-deployer-git 插件，可以在Hexo站点目录下执行以下命令安装该插件

1	# npm install hexo-deployer-git --save

然后cd 到你的Hexo站点的初始化目录blog下，执行如下命令进行发布

1	# hexo deploy # 简写命令 hexo d

看到类似如下图所示的返回，即表示发布成功。

Hexo 命令

常用命令：

hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo clean # 清除缓存 网页正常情况下可以忽略此条命令
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口（默认端口4000，'ctrl + c'关闭server）
hexo deploy #将.deploy目录部署到GitHub

常用复合命令：

1 2	hexo deploy -g hexo server -g

简写：

hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

至此，基本操作介绍完毕，以下内容普通用户无需了解。

目录介绍

默认目录结构：

.
├── .deploy
├── public
├── scaffolds
├── scripts
├── source
|   ├── _drafts
|   └── _posts
├── themes
├── _config.yml
└── package.json

.deploy：执行 hexo deploy 命令部署到 GitHub 上的内容目录
public：执行 hexo generate 命令，输出的静态网页内容目录
scaffolds：layout 模板文件目录，其中的 md 文件可以添加编辑
scripts：扩展脚本目录，这里可以自定义一些 javascript 脚本
source：文章源码目录，该目录下的 markdown 和 html 文件均会被 hexo 处理。该页面对应 repo 的根目录，404 文件、favicon.ico 文件，CNAME 文件等都应该放这里，该目录下可新建页面目录。
- _drafts：草稿文章
- _posts：发布文章
themes：主题文件目录
_config.yml：全局配置文件，大多数的设置都在这里
package.json：应用程序数据，指明 hexo 的版本等信息，类似于一般软件中的关于按钮

接下来是重头戏_config.yml，做个简单说明：

# Hexo Configuration
## Docs: http://zespia.tw/hexo/docs/configure.html
## Source: https://github.com/tommy351/hexo/

# Site #整站的基本信息
title: 不如 #网站标题
subtitle: 码农，程序猿，未来的昏析师 #网站副标题
description: bruce sha's blog | java | scala | bi #网站描述，给搜索引擎用的，在生成html中的head->meta中可看到
author: bruce #网站作者，在下方显示
email: bu.ru@qq.com #联系邮箱
language: zh-CN #语言

# URL #域名和文件结构
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://ibruce.info #你的域名
root: /
permalink: :year/:month/:day/:title/
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code

# Writing #写文章选项
new_post_name: :title.md # File name of new posts
default_layout: post #默认layout方式
auto_spacing: false # Add spaces between asian characters and western characters
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
max_open_file: 100
multi_thread: true
filename_case: 0
render_drafts: false
highlight: #代码高亮
  enable: true #是否启用
  line_number: false #是否显示行号
  tab_replace:

# Category & Tag #分类与标签
default_category: uncategorized # default
category_map:
tag_map:

# Archives #存档，这里的说明好像不对。全部选择1，这个选项与主题中的选项有时候会有冲突
## 2: Enable pagination
## 1: Disable pagination
## 0: Fully Disable
archive: 1
category: 1
tag: 1

# Server #本地服务参数
## Hexo uses Connect as a server
## You can customize the logger format as defined in
## http://www.senchalabs.org/connect/logger.html
port: 4000
logger: true
logger_format:

# Date / Time format #日期显示格式
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: MMM D YYYY
time_format: H:mm:ss

# Pagination #分页设置
## Set per_page to 0 to disable pagination
per_page: 10 #每页10篇文章
pagination_dir: page

# Disqus #社会化评论disqus，我使用多说，在主题中配置
disqus_shortname:

# Extensions #插件，暂时未安装插件
## Plugins: https://github.com/tommy351/hexo/wiki/Plugins
## Themes: https://github.com/tommy351/hexo/wiki/Themes
## 主题
theme: modernist # raytaylorism # pacman # modernist # light
exclude_generator:

# Deployment #部署
## Docs: http://zespia.tw/hexo/docs/deploy.html
deploy: 
  type: git
  #repository: git@e.coding.net:opsunion/blogsite.git
  repository: git@github.com:Eddieeo/eddieeo.github.io.git  #你的GitHub Pages仓库
  branch: master

修改局部页面

页面展现的全部逻辑都在每个主题中控制，源代码在 站点目录/themes/你使用的主题/ 中，以 hexo-theme-pure 主题为例：

.
├── languages          #多语言
|   ├── default.yml    #默认语言
|   └── zh-CN.yml      #中文语言
├── layout             #布局，根目录下的*.ejs文件是对主页，分页，存档等的控制
|   ├── _partial       #局部的布局，此目录下的*.ejs是对头尾等局部的控制
|   └── _widget        #小挂件的布局，页面下方小挂件的控制
├── source             #源码
|   ├── css            #css源码 
|   |   ├── _base      #*.styl基础css
|   |   ├── _partial   #*.styl局部css
|   |   ├── fonts      #字体
|   |   ├── images     #图片
|   |   └── style.styl #*.styl引入需要的css源码
|   ├── fancybox       #fancybox效果源码
|   └── js             #javascript源代码
├── _config.yml        #主题配置文件
└── README.md          #用GitHub的都知道

更新

更新 hexo：

1	# npm update -g hexo

更新主题：

1 2	# cd 站点目录/themes/你的主题 # git pull

更新插件：

1 2	# cd 站点目录/ # npm update

本文链接： https://linuxops.fun/2015/09/01/9af43afc.html
版权声明： 本博客所有文章除特别声明外，均采用 CC BY 4.0 CN协议许可协议。转载请注明出处！

Hexo搭建个人博客系统

什么是 Hexo？

系统环境

环境准备

安装Git

安装 Node.js

安装nvm

使用nvm安装node

搭建Hexo博客系统

安装Hexo

初始化Blog目录

安装Hexo依赖包

更换Hexo主题

更新主题

写文章

使用系统默认编辑器vim编写Markdown文档

使用Windows上的图形编辑器Typora编写Markdown文档

本地前台启动Hexo

PM2工具管理Hexo开机自启且后台运行

安装PM2管理Hexo后台运行

PM2设置开机自启动

部署静态页面到Github Pages 或 Coding Pages

注册申请GitHub用户或Coding用户

配置SSH连接Github或Coding

添加 SSH-Key

生成密钥

添加ssh密钥到Github

添加ssh密钥到Coding

部署到Github Pages

创建代码仓库

修改Hexo站点配置文件_config.yml

生成静态页面

发布到Github Pages

部署到Coding Pages

创建代码仓库

修改Hexo站点配置文件_config.yml

生成静态页面

发布到Coding Pages

开启静态网站

同时部署到Github Pages和Coding Pages

创建代码仓库

修改Hexo站点配置文件_config.yml

生成静态页面

同时发布到Github Pages和Coding Pages

Hexo 命令

常用命令：

常用复合命令：

简写：

目录介绍

默认目录结构：

修改局部页面

更新

更新 hexo：

更新主题：

更新插件：

Eddie's BlogInternet Operator & Developer