什么是 Hexo?

Hexo 是一个基于 node.js 快速、简洁且高效的博客框架。支持 Markdown 写作,可一键部署到 GitHub平台。Hexo 还有丰富的主题和插件可供定制和扩展,可以瞬间拥有个人专属的博客网站。

前置准备

本篇博客不提供安装教程(emmmm就是我太懒了),请自行搜索

  • node.js(不低于10.13,建议使用12.0及以上版本)

    Hexo基于node.js

  • npm

    node.js的包管理工具

查看电脑是否安装了环境

1
2
3
4
# 查看node.js版本
node -v
# 查看npm版本
npm -v

有版本输出就代表环境安装好了

那我们就正式开始Hexo之路吧~

安装Hexo

1
npm install -g hexo-cli

-g 代表全局安装(不必太过纠结这个哈~熟悉前端和node的朋友可以直接npm install hexo-cli

好啦!到这里,Hexo已经安装好啦 ~

Hexo操作

下面是Hexo的一些操作指南,助你快速入门Hexo

初始化

这里讲两种方式哈,效果都一样,随便选个就行

方法一

  1. 新建一个文件夹
  2. cmd切换到该路径,输入hexo init

方法二

hexo init [name]

name是文件夹名字,相当于省去了方法一的第一步

生成

经过上一步的初始化操作,你的Hexo博客已经搭建起来啦

1
2
hexo g # 生成
hexo s # 本地启动服务

这时候,终端会开启一个服务,一般是http://localhost:4000,按住Ctrl单击就可以打开

这时候你就可以看到一个Hexo博客啦~

如果无法显示,可能是 4000 端口被占用了,可以使用如下命令指定端口

1
hexo s -p 4444 # 指定4444端口或者其他端口

如果经常4000端口被占用,建议一劳永逸,直接修改配置文件node_modules/hexo-server/index.js,将默认端口改成4444或者其他端口

1
2
3
4
5
6
7
8
hexo.config.server = assign({
//将默认端口改成4444
port: 4444,
log: false,
ip: '0.0.0.0',
compress: false,
header: true
}, hexo.config.server);

如果你的github也配置好了,那么输入

1
hexo d # 部署

就可以把本地的博客部署到GitHub Pages上啦

新建博客

  1. 新建一个文章
1
2
3
hexo n "postName"		# 新建文章,postName未文章名
# or 不使用简写
hexo new "postName" # 新建文章,postName未文章名
  1. 打开博客目录下的/source/_posts就可以看到刚刚新建的md文件啦
  2. 编辑md文件,保存
  3. 生成并本地预览
1
2
3
4
5
6
7
hexo s -g # 组合命令,生成并本地预览
# or 分开输入两条命令
hexo g # 生成(缩写)
hexo s # 预览(缩写)
# or 分开并不使用简写
hexo generate # 生成
hexo server # 预览

设置标头

1
2
3
4
5
6
7
8
9
10
title: 我是文章名
date: 2018-08-13 09:22:18
# 标签
tags:
- markdown
- blog
# 分类
categories:
- tutorial
- markdown

插入图片

在 _config.yml 开启资源文件夹

1
post_asset_folder: true

开启之后,在 _posts 目录下会生成一个与文章同名的文件夹。把需要插入到文章中的图片放到该文件夹中,并在写文章时通过如下标签引用即可。

1
{% asset_img <图片名> [图片标题] %}

更换主题

默认主题太丑了?那换个好看滴主题叭~~

直接去官网看看,找到喜欢的换就行,一般主题的开发者会写好怎么更换的哈~(emmm是我懒)

换好了之后,执行

1
2
3
4
hexo clean	# 清除,避免更换失败
hexo s -g # 生成,本地预览
## 预览没问题之后
hexo d # 部署