当前标签 / 模板引擎 / 总共3篇

我为什么要从 Hexo 更换到 Hugo

2019-08-30 · 大约 500 个字 · 预计 3 分钟读完

前言

最近比较烦的是我的博客本以为很完美了，不用再折腾了，没想到 Hexo 有一个很大的弊端。我忍痛割爱的计划将 Hexo 引擎更换为基于 Go 语言的 Hugo 模板引擎。Hexo 优点很多，缺点就是生成静态文件 (hexo g) 速度真的是太慢了。Hexo 是基于 Nodejs 的，有很多插件，而 Hugo 没有插件，使用自带的 Go html 模板实现，这个速度真的是牛，基本上在 Hexo 上面十几分钟，使用 Hugo 只需要几秒钟。

在更换过程中我想保留我原来博客的主题风格，所以很多东西都是逐渐仿照实现过去的，但是最让人头疼的并不是去实现这些功能，而是迁移过程中为了防止路径不同（大小写）和 keywords description 的不同导致的 SEO 问题。其实目前我已经完全实现模板复制，但是我还是计划花一两个月慢慢迁移过去，这样对本站的影响可以尽量做到最小。

pug模板引擎（下）

2018-10-23 · 大约 1500 个字 · 预计 8 分钟读完

Hexo · 主题开发

Nodejs · 模板引擎 · pug

逻辑语法

以下是关于模板逻辑的语法。

JavaScript代码

不输出的代码

用 - 开始一段不直接进行输出的代码。

1
2
- for (var x = 0; x < 3; x++)
  li item

生成后

1
2
3
<li>item</li>
<li>item</li>
<li>item</li>

输出的代码

用=开始一段带有输出的代码，它应该是可以被求值的一个 JavaScript 表达式。为安全起见，它将被 HTML 转义。

1
2
3
p
  = '这个代码被 <转义> 了！'
p= '这个代码被 <转义> 了！'

生成后

1
2
3
<p>这个代码被 &lt;转义&gt; 了！
</p>
<p>这个代码被 &lt;转义&gt; 了！</p>

不转义的输出代码

用 != 开始一段不转义的，带有输出的代码。这将不会做任何转义，所以用于执行用户的输入将会不安全。

1
2
3
p
  != '这段文字<strong>没有</strong>被转义！'
p!= '这段文字' + '<strong>没有</strong>被转义!'

生成后

1
2
<p>这段文字<strong>没有</strong>被转义！</p>
<p>这段文字<strong>没有</strong>被转义！</p>

pug模板引擎（上）

2018-10-22 · 大约 600 个字 · 预计 3 分钟读完

Hexo · 主题开发

Nodejs · 模板引擎 · pug

安装

1
sudo npm install pug

但命令行提示 pug 命令未找到，接下来安装 pug-cli,注意一定要全局安装，否则无法正常编译。

1
sudo npm install pug-cli -g

查看版本

1
2
3
>>> $ pug --version
pug version: 2.0.3
pug-cli version: 1.0.0-alpha6

生成HTML

新建文件命名为index.pug

1
2
3
4
html
    head
        title dp2px
    body

在命令行输入

1
2
>>> $ pug index.pug 
rendered index.html

你会发现在同目录生成了一个 index.html 文件，内容如下

1
<html><head><title>dp2px</title></head><body></body></html>

接下来我们使用pug -w实现自动编译。

1
>>> $ pug index.pug -w

我使用的 VS Code,你可以让你的编辑器左右两边显示，方便实时查看。