Hexo: {% raw %} 无法渲染 ``` 代码段

[OhYee]

hexo: 3.2.2
node: 6.2.1

{% raw %}
```cpp test
include <cstdio>
```
{% endraw %}

渲染出的是

undefined

[NoahDragon]

确实是个问题。

这个Raw tag是Nunjucks里用来escape其syntax时用的。往往是当文本与Nunjucks syntax有冲突时才需要使用，如MathJax.
https://mozilla.github.io/nunjucks/templating.html#raw

[OhYee]

@NoahDragon
如果我想自己写一个tag,功能是在content内容前后加上我写好的标签
当在代码块前后加使用这个功能就会导致 undefined
要解决这个问题就只能手动在代码块前后加标签不能用 tag 么

[haohuawu]

我也发现了这个问题，只要是在Nunjucks的tag里写```代码块```，最终都会渲染成undefined。看了源码发现hexo对于```做了全局特殊处理。

举个例子，我想自定义一个tag，然后tag里面可以写markdown、我希望markdown的代码高亮用的是hexo自带的（自己写插件支持），这样使用tag：

{% api 简介 %}
### 简介

```
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
WebView.setWebContentsDebuggingEnabled(true);
}
}
```

{% endapi %}

我们看看 hexo 会对这段代码怎么处理：

第一阶段，api tag 中的 ``` 部分变成了：

{% api 简介 %}
### 简介

{% endapi %}

详见：https://github.com/hexojs/hexo/blob/master/lib/plugins/filter/before_post_render/backtick_code_block.js

第二阶段，转义Nunjucks标签，渲染markdown

详见：https://github.com/hexojs/hexo/blob/master/lib/hexo/post.js#L276

第三阶段，还原标签内容，交由 hexo tag 处理

{% api 简介 %}
### 简介

{% endapi %}

详见：https://github.com/hexojs/hexo/blob/master/lib/hexo/post.js#L245

hexo tag拿到上面的内容会先转义，然后交给自定义的tag函数处理

这时候我们得到的内容：

{% api 简介 %}
### 简介

{% endapi %}

第四阶段，hexo tag 本身的渲染函数还原转义

{% api 简介 %}
### 简介

undefined

{% endapi %}

详见：https://github.com/hexojs/hexo/blob/master/lib/extend/tag.js#L68

好了，bug的产生过程有了，接下来提个建议：

hexo 不处理自定义tag里的```，可以让自定义tag自己处理或者等他处理完再处理，防止冲突。

那么，作为社区其他开发者怎么办呢？有解决办法吗？答案是有的，就是稍显麻烦，自己写2个filter：

const rEscapeContent = /<escape(?:[^>]*)>([\s\S]*?)<\/escape>/g;
const placeholder = '\uFFFD';
const rPlaceholder = /(?:<|&lt;)\!--\uFFFD(\d+)--(?:>|&gt;)/g;
const cache = [];
function escapeContent(str) {
  return '<!--' + placeholder + (cache.push(str) - 1) + '-->';
}
hexo.extend.filter.register('before_post_render', function(data) {
  data.content = data.content.replace(rEscapeContent, function(match, content) {
    return escapeContent(content);
  });
  return data;
});

hexo.extend.filter.register('after_post_render', function(data) {
  data.content = data.content.replace(rPlaceholder, function() {
    return cache[arguments[1]];
  });
  return data;
});

注意，placeholder 这个千万别和hexo（\uFFFC）的冲突了，选个其他的吧

[OhYee]

@haohuawu
完美解决 感谢

[xiaomizhou66]

这个 filter 代码放在哪里呀

[OhYee]

@xiaomizhou66
<BlogRoot>/scripts/tags.js

[luoxuzhi]

@xiaomizhou66
<BlogRoot>/scripts/tags.js

在博客的根目录加了这个js后怎么引用啊？？

[OhYee]

@luoxuzhi
在博客的根目录加了这个js后怎么引用啊？？

Hexo会自己引入进去

[sshwy]

加一句：还有一个解决方案：使用hexo自带的codeblock tag