如何用hexo在ubuntu上搭建一个静态博客

简介

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

本博客就是用hexo搭建的,是不是觉得非常简洁大方?

安装依赖

1
2
3
sudo apt-get update 
sudo apt-get install npm nodejs-legacy git -y
sudo npm install hexo-cli -g

配置和初始化

1
2
3
4
5
6
7
hexo init ~/blog
cd ~/blog
npm install
# 下载next 主题
git clone https://github.com/iissnan/hexo-theme-next themes/next
# 替换主题
sed '/theme: landscape/ ctheme: next' -i _config.yml

运行测试服务器

1
hexo server

如果一切顺利,在http://<you_server_ip>:4000/可以预览到效果。用-p可以指定端口

个性化设置

对于next的主题,可以有很多配置可选,比如

  • 创建“关于我页面”
  • 创建“分类页面”
  • 设置头象
  • 设置菜单
  • 设置评论
  • 添加统计等

更详细的配置见开始使用hexowiki 特性配置

创建和发布博文

1
hexo new first-post

就可以增加一篇博文,vim source/_post/first-post.md可以编辑。
编辑好之后hexo server 可以预览。
运行hexo g会在 public文件夹下生成所有的静态文件。
如里用nginx的root命令指到该文件夹下,就可以正式访问了。

一键搭建脚本

上面的可能太啰嗦,于是我把上面的语句整理下,做成一键搭建脚本。
可以在一个干净的ubuntu环境下一键安装的配置

https://gist.github.com/finghine/32014696351e3033c73baaa0fa6f5776#file-hexo_build_blog-sh

常见问题

  • 如何给博文增加分类,在tags下面一行增加categories: x就会给文章增加x的分类
  • 如何增加新导航页面,可以hexo new page xxx,xxx可以是about,tags,categories等
  • 如何增加新导航页面的菜单图标,去http://fontawesome.io/icons/中选,再修改_config.yml下的menu_icons

结束语

如果安装完npm后,直接安装 hexo-cli,会出现错误,因为少了依赖,参见
要记得设置时区sudo timedatectl set-timezone Asia/Chongqing

2018_05_17 更新

在这个时候hexo,按上面的方法进行安装就出会出这个错误,进行不下去。

1
2
npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents@1.2.4

2018_06_08 更新

使用docekr的方式进行安装