博客切换至 Hexo
blog / hexo / icarus9 分钟 读完 (大约 1410 个字)

博客切换至 Hexo

最近将博客的生成器更改为了 Hexo，并使用了主题 icarus，当然，依然是静态博客。

整个迁移过程异常的顺利、简单，并且博客也比之前漂亮了很多，在这里做个笔记，算是自己的一个 icarus 入门教程吧。

背景

之前使用的是 Hugo 框架生成静态博客，虽然 Hugo 宣称是世界上最快的网站生成器，且很多大佬都表示 Hugo 很简单，但我个人觉得并非如此。原因有如下几点：

  • 性能：静态博客最终生成的都是 html、css、js，然后随便挂个 web 服务器就可以发布，撑死我每天也写不出两篇文章，此时渲染几十毫秒，和渲染几秒对我都没多大影响。

  • 学习成本：静态博客推崇的是约定优于配置，什么意思呢？静态博客简单的代价就是很多东西都是有默认配置的，如果你想要自定义一些东西，你必须得查看文档，看看都有些什么约定、参数，都是用来干嘛的、怎么调整。在这方面，Hexo 的文档只有 24 页，而 Hugo 的文档有 100 多页，Hugo 确实更强大，但如果你想要做一些修改，也需要更高的学习成本。

  • 这里主要是文档，Hugo 不仅有 100 多页的文档，而且还都是英文的。而 Hexo 不仅文档只有十几页，而且还有中文翻译（虽然有点滞后，但不影响了解 Hexo）。

  • 生态：Hugo 与 Hexo 都有三百多个主题，看起来差不多，但很多主题的质量其实很差的，我不是针对谁，我是说在在座的两位。Hugo 我至今没有找到一个简单且满意的主题，而 Hexo，从找主题，到安装，简单修改，运行，一共几个小时就搞定了，丝滑般的享受，我的头发又回来了o(￣▽￣)ブ

总结一下：Hugo 很强，也很难。有多难？我觉得比 Kubernetes 还难！Hexo 各方面都很简单，优秀的主题同样可以赋予静态博客生命，如何选择取决于自己。

以下，是自己使用 Hexo 以及 icarus 主题的一点笔记。

安装 node.js

前往 nodejs.org 根据自己的平台下载对应的版本。

对于 Ubuntu 用户，你也可以执行以下命令：

1
$ apt-get install -y npm

安装完成后查看 node 和 npm 版本信息，确保安装成功：

1
2
3
4
$ node --version
v12.16.1
$ npm --version
6.14.6

安装 Hexo

在安装好 node.js 后，执行下面的命令即可：

1
$ npm install hexo-cli -g

安装完成后查看 hexo 版本信息，确保安装成功：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$ hexo -v
hexo: 4.2.1
hexo-cli: 3.1.0
os: Linux 4.4.0-18362-Microsoft linux x64
http_parser: 2.7.1
node: 8.10.0
v8: 6.2.414.50
uv: 1.18.0
zlib: 1.2.11
ares: 1.14.0
modules: 57
nghttp2: 1.30.0
openssl: 1.0.2n
icu: 60.2
unicode: 10.0
cldr: 32.0.1
tz: 2017c

初始化博客并下载 Icarus 主题

  1. 先切换至你写代码的目录，然后初始化博客
1
2
$ hexo init <your-blog-name>
$ cd <your-blog-name>/themes

注意：your-blog-name 是一个目录名，你应该将他替换为自己需要的名字。

  1. 下载 Icarus 主题
1
git clone https://github.com/ppoffice/hexo-theme-icarus.git themes/icarus -b <version number> --depth 1

注意： 是 icarus 主题的版本号，你可以在 icarus release 查看可用的版本号。

  1. 使用 Icarus 主题

编辑 _config.yml 文件，指定主题：

1
$ cd ../ && vi _config.yml

找到 theme 项，将值设为 icarus：

_config.yml
1
theme: icarus

启动博客

1
$ hexo server

此时，可能会提示你缺少一些依赖，需要安装，比如这种：

根据给出的提示，运行安装命令就可以了。

随后你就可以访问 http://localhost:4000 查看你的博客了。

虽然此时的博客还是一个毛坯，但看起来还是挺好看的，不得不说 icarus 的作者这方面做的很好，接下来就是根据自己的需求，做一些调整了。

样式改动

对原主题样式的修改都集中在 themes/icarus/include/style/custom.styl 文件内。

about 页和 404 页

about 页面，需要创建一个 source/about/index.md 的文件来进行描述，生成的站点即可正常访问 about 页面

404 页面，需要创建一个 source/404.md 的文件来描述，会生成一个 404.html，需配合 web 服务器使用。

CDN 加速

所有的静态资源，如：css、js、图片、字体文件均通过 CDN 加速，站点仅提供 html 内容。

文章的图片在写作时就直接通过图床传到 CDN 上了。

而网页的静态文件，使用的方法很土，手动修改了 themes/icarus/layout 下所有涉及引入静态资源代码的路径为 CDN 路径，可以通过关键字 自定义 CDN 找到它们。

GitHub Action

使用 GitHub Action，自动部署到了 GitHub Page 和自己的服务下，相关内容可以查看 .github/workflows/ci.yml 文件

参考链接

hexo.io

Icarus快速上手

Icarus用户指南

#

评论

关注我
×