与精子同款的博客主题 Simple Block 现已发布！

时间 2020-02-22

标签精子博客主题 simple block 现已发布繁體版

原文原文链接

https://jysperm.me/2015/07/hexo-theme-simpleblock前端

今年年初，由于我已经好久不写 PHP 了，因此我将个人博客从 WordPress 换到了基于 Node.js 的 Hexo, 顺便本身编写了一个专用于个人博客的主题。git

一周前我用 Github 开源的 | fee503fdb968dcd1421ecbe0c6dbedf31 | 重写了这个博客主题，将与我相关的我的信息修改成可配置项，而后将这个主题正式发布为了 Simple Block, 它实现了：github

支持使用 Jade 和 Markdown 向边栏添加小部件，或向正文前添加横幅。npm
响应式设计，支持移动设备直接浏览，首次加载（gzip）仅 15k.gulp
为 Mac, Windows 以及 Linux 挑选了恰当的字体。hexo
正文使用 Github 开源的 Markdown 样式。wordpress

这个主题掺入了很是多个人我的偏好，好比我使用了 Jade 和 CoffeeScript, 使用了 Gulp, 以及页面中一些奇怪部分（连接到源文件什么的）。工具

在设计上，我参考了我原来使用的 WordPress 2012 默认主题 Twenty Twelve, 我将各个部分放到了单独的白色区块上，并使间隙透明，因而就有了 Simple Block.字体

我平时不多设计前端页面，自知设计水平不好，这款主题基本上表明了我近期前端设计的最高水平了。插件

实现细节

Hexo 支持用 Node.js 编写插件或者主题的 helper, 这是很是大的一个亮点。

我看了官网上列出的几个主题，它们都没有 npm 依赖，在说明中建议直接将 Git 仓库克隆下来，就算安装完成了。

而个人主题依赖了 coffee-script, jade 以及 marked, 因此须要一个安装依赖的过程，Hexo 并不会自动为主题安装依赖，因此须要用户自行运行 npm install.

另外一方面我发现官网上的主题都直接将前端依赖放到了 Git 仓库中，我以为这样是不恰当的，因而我使用 bower 和 gulp 来构建前端样式，而后将编译好的版本上传到 Github 的 Release 中，让用户下载编译好的版本，而不是直接克隆 Git 仓库。其实 Hexo 提供了对 CSS 方言的自动编译，但功能较弱，没有办法彻底替代 gulp 等构建工具的功能。

以上是我在开发这个主题的过程当中发现的 Hexo 主题机制的一些问题，我还没探索出合适的解决方案，各位在安装的过程当中若是遇到问题，请向我提出。

https://jysperm.me/2015/07/hexo-theme-simpleblock