Hexo-NexT博客问题汇总

引言

本文对Hexo博客+NexT主题使用中出现的各种问题进行总结,方便读者解决这些遇到的相同问题。

博文生成失败

问题描述

问题起源于一次博文的生成:

hexo new RT2

之后对博文的配置信息进行了简单的填写:

title: Ray Tracing: The Next Week
comment: false
date: 2021-07-30 00:42:59
type:
tags:
- Computer Graphics
- Ray Tracing
categories: 光线追踪 (Ray Tracing)
banner_img:
index_img:
abbrlink:
translate_title:
top:
mathjax:

之后打算 hexo 三连:

hexo clean && hexo g && hexo d

但是出现了报错:

ERROR {
err: YAMLException: incomplete explicit mapping pair; a key node is missed; or followed by a non-tabulated empty line at line 1, column 19:
title: Ray Tracing: The Next Week
^
at generateError (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:167:10)
at throwError (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:173:9)
at readBlockMapping (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:1027:9)
at composeNode (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:1359:12)
at readDocument (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:1525:3)
at loadDocuments (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:1588:5)
at Object.load (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/node_modules/js-yaml/lib/js-yaml/loader.js:1614:19)
at parseYAML (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/lib/front_matter.js:69:23)
at parse (/Users/apple/Desktop/blog/node_modules/hexo-front-matter/lib/front_matter.js:50:12)
at /Users/apple/Desktop/blog/node_modules/hexo/lib/plugins/processor/post.js:51:20
at tryCatcher (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/util.js:16:23)
at Promise._settlePromiseFromHandler (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:544:35)
at Promise._settlePromise (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:604:18)
at Promise._settlePromise0 (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:649:10)
at Promise._settlePromises (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:729:18)
at Promise._fulfill (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:673:18)
at PromiseArray._resolve (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise_array.js:127:19)
at PromiseArray._promiseFulfilled (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise_array.js:145:14)
at PromiseArray._iterate (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise_array.js:115:31)
at PromiseArray.init [as _init] (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise_array.js:79:10)
at Promise._settlePromise (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:601:21)
at Promise._settlePromise0 (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:649:10)
at Promise._settlePromises (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:729:18)
at Promise._fulfill (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:673:18)
at PromiseArray._resolve (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise_array.js:127:19)
at PromiseArray._promiseFulfilled (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise_array.js:145:14)
at Promise._settlePromise (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:609:26)
at Promise._settlePromise0 (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:649:10)
at Promise._settlePromises (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/promise.js:729:18)
at _drainQueueStep (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/async.js:93:12)
at _drainQueue (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/async.js:86:9)
at Async._drainQueues (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/async.js:102:5)
at Immediate.Async.drainQueues [as _onImmediate] (/Users/apple/Desktop/blog/node_modules/bluebird/js/release/async.js:15:14)
at processImmediate (internal/timers.js:461:21) {
reason: 'incomplete explicit mapping pair; a key node is missed; or followed by a non-tabulated empty line',
mark: Mark {
name: null,
buffer: 'title: Ray Tracing: The Next Week\n' +
'comment: false\n' +
'date: 2021-07-30 00:42:59\n' +
'type:\n' +
'tags:\n' +
' - Computer Graphics\n' +
' - Ray Tracing\n' +
'categories: 光线追踪 (Ray Tracing)\n' +
'banner_img:\n' +
'index_img:\n' +
'abbrlink:\n' +
'translate_title:\n' +
'top:\n' +
'mathjax:\n' +
'\x00',
position: 18,
line: 0,
column: 18
}
}
} Process failed: %s _posts/RT2.md

解决方案

报错信息提示的很明确,原因是我们的标题出现了 : 造成文章无法正常生成,去掉即可:

-title: Ray Tracing: The Next Week
+title: Ray Tracing The Next Week
comment: false
date: 2021-07-30 00:42:59
type:
tags:
- Computer Graphics
- Ray Tracing
categories: 光线追踪 (Ray Tracing)
banner_img:
index_img:
abbrlink:
translate_title:
top:
mathjax:

标签云回滚

问题描述

在部分页面在下拉过程会出现回滚情况,导致无法到达底部。最开始是在标签页发现的,几次测试还具有一定的随机性,在Chrome上。在手机端因为不显示sidebar所以没有这个问题。

解决方案

注释掉标签云:

-      {% if site.tags.length > 1 %}
- <script type="text/javascript" charset="utf-8" src="{{ url_for('/js/tagcloud.js') }}"></script>
- <script type="text/javascript" charset="utf-8" src="{{ url_for('/js/tagcanvas.js') }}"></script>
- <div class="widget-wrap">
- <h5 class="widget-title"></h5>
- <div id="myCanvasContainer" class="widget tagcloud">
- <canvas width="250" height="250" id="resCanvas" style="width:100%">
- {{ list_tags() }}
- </canvas>
- </div>
- </div>
- {% endif %}

Pjax刷新

问题描述

在使用音乐播放器Aplayer与说说Artitalk时发现必须刷新两次才能加载出来。

解决方案

最开始尝试在这几个页面不使用pjax:

pjax: ture  
exclude:
- '/about/'
- '/artitalk/'

但问题并没有解决,第一次刷新还是什么也没有,需要再次刷新才显示内容。

目前没有两全其美的办法,对于页面间跳转我的需求并不是很高,所以在主题配置文件中关闭了pjax选项,音乐播放器与Artitalk均恢复正常。

# Easily enable fast Ajax navigation on your website.
# Dependencies: https://github.com/theme-next/theme-next-pjax
- pjax: ture
+ pjax: false

后面加入Artitalk的交流群询问是否兼容pjax,得到的答案是不行。在关闭pjax后页面间跳转明显变慢,后面又查询了一下找到一种折中的办法:pjax页面刷新两次。在themes/layout/pjax.swig中加入刷新代码:

<script>
var pjax = new Pjax({
selectors: [
'head title',
'#page-configurations',
'.content-wrap',
'.post-toc-wrap',
'.languages',
'#pjax'
],
switches: {
'.post-toc-wrap': Pjax.switches.innerHTML
},
analytics: false,
cacheBust: false,
scrollTo : !CONFIG.bookmark.enable
});

window.addEventListener('pjax:success', () => {
document.querySelectorAll('script[data-pjax], script#page-configurations, #pjax script').forEach(element => {
var code = element.text || element.textContent || element.innerHTML || '';
var parent = element.parentNode;
parent.removeChild(element);
var script = document.createElement('script');
if (element.id) {
script.id = element.id;
}
if (element.className) {
script.className = element.className;
}
if (element.type) {
script.type = element.type;
}
if (element.src) {
script.src = element.src;
// Force synchronous loading of peripheral JS.
script.async = false;
}
if (element.dataset.pjax !== undefined) {
script.dataset.pjax = '';
}
if (code !== '') {
script.appendChild(document.createTextNode(code));
}
parent.appendChild(script);
});


NexT.boot.refresh();
+ loadMeting();
// Define Motion Sequence & Bootstrap Motion.
if (CONFIG.motion.enable) {
NexT.motion.integrator
.init()
.add(NexT.motion.middleWares.subMenu)
.add(NexT.motion.middleWares.postList)
.bootstrap();
}


NexT.utils.updateSidebarPosition();

+ $(document).ready(function () {
+ if(location.href.indexOf("#reloaded")==-1){
+ location.href=location.href+"#reloaded";
+ location.reload();
+ }
+ })

});
</script>

这样从某种程度保证了性能和花里胡哨,但刷新也无形中降低了性能,所以是把双刃剑取舍由读者来选择。但如果我们简单掉换一下顺序,在开头就重新刷新就没必要全部渲染完后再重新加载,性能提升了许多:

<script>
var pjax = new Pjax({
selectors: [
'head title',
'#page-configurations',
'.content-wrap',
'.post-toc-wrap',
'.languages',
'#pjax'
],
switches: {
'.post-toc-wrap': Pjax.switches.innerHTML
},
analytics: false,
cacheBust: false,
scrollTo : !CONFIG.bookmark.enable
});

window.addEventListener('pjax:success', () => {
+ $(document).ready(function () {

+ if(location.href.indexOf("#reloaded")==-1){
+ location.href=location.href+"#reloaded";
+ location.reload();
+ }
+})
#在这后面可以加入程序的其他代码


document.querySelectorAll('script[data-pjax], script#page-configurations, #pjax script').forEach(element => {
var code = element.text || element.textContent || element.innerHTML || '';
var parent = element.parentNode;
parent.removeChild(element);
var script = document.createElement('script');
if (element.id) {
script.id = element.id;
}
if (element.className) {
script.className = element.className;
}
if (element.type) {
script.type = element.type;
}
if (element.src) {
script.src = element.src;
// Force synchronous loading of peripheral JS.
script.async = false;
}
if (element.dataset.pjax !== undefined) {
script.dataset.pjax = '';
}
if (code !== '') {
script.appendChild(document.createTextNode(code));
}
parent.appendChild(script);
});


NexT.boot.refresh();

// Define Motion Sequence & Bootstrap Motion.
if (CONFIG.motion.enable) {
NexT.motion.integrator
.init()
.add(NexT.motion.middleWares.subMenu)
.add(NexT.motion.middleWares.postList)
.bootstrap();
}

NexT.utils.updateSidebarPosition();

- $(document).ready(function () {
- if(location.href.indexOf("#reloaded")==-1){
- location.href=location.href+"#reloaded";
- location.reload();
- }
- })

});
</script>

版本控制

强烈建议无论是否以VSCode为主力编辑器都下载一个,它的git版本控制插件让我可以进行一些测试并以GUI可视化的方式回滚。

SSH失效

问题描述

kex_exchange_identification: read: Connection reset by peer
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
FATAL {
err: Error: Spawn failed
at ChildProcess.<anonymous> (/Users/apple/Desktop/Dev/blog/node_modules/hexo-deployer-git/node_modules/hexo-util/lib/spawn.js:51:21)
at ChildProcess.emit (events.js:315:20)
at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12) {
code: 128
}
} Something's wrong. Maybe you can find the solution here: %s https://hexo.io/docs/troubleshooting.html

解决方案

cd ~
cd .ssh
ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
cat id_rsa.pub

Font-Awesome 图标失效

问题描述

最近更新 NexT 主题的 Font-Awesome 图标失效了,还不是全部失效,是部分失效显示为空白。

解决方案

首先检查主题的 _config.yml 的 CDN:

# Internal version: 5.13.0
# fontawesome: //cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5/css/all.min.css
# fontawesome: //cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css
fontawesome: //cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5/css/all.min.css

仔细观察,新版本使用的 Font-Awesome 和之前原来的 CDN 版本不一样,所以更改一下 CDN:

# Internal version: 4.7.0
# fontawesome: //cdn.jsdelivr.net/npm/font-awesome@4/css/font-awesome.min.css
# fontawesome: //cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css
fontawesome: //cdn.jsdelivr.net/npm/font-awesome@4/css/font-awesome.min.css

再检查一下自己的图标:

# Social Links
# Usage: `Key: permalink || icon`
# Key is the link label showing to end users.
# Value before `||` delimiter is the target permalink, value after `||` delimiter is the name of Font Awesome icon.
social:
E-Mail: mailto:zoeyousa@gmail.com || fa fa-envelope
GitHub: https://github.com/Yousazoe || fab fa-github
Twitter: https://twitter.com/YousaZoe || fab fa-twitter
Weibo: https://www.weibo.com/6034231696/profile?rightmod=1&wvr=6&mod=personinfo&is_all=1 || fab fa-weibo
Steam: https://steamcommunity.com/profiles/76561198856466228/ || fab fa-steam
Chess: https://www.chess.com/member/yousazoe || fab fa-chess-pawn
RSS: /atom.xml || fa fa-rss

#GitHub: https://github.com/yourname || github
#E-Mail: mailto:yourname@gmail.com || envelope
#Weibo: https://weibo.com/yourname || weibo
#Google: https://plus.google.com/yourname || google
#Twitter: https://twitter.com/yourname || twitter
#FB Page: https://www.facebook.com/yourname || facebook
#StackOverflow: https://stackoverflow.com/yourname || stack-overflow
#YouTube: https://youtube.com/yourname || youtube
#Instagram: https://instagram.com/yourname || instagram
#Skype: skype:yourname?call|chat || skype

可以发现失效的图标都是 fa fa-xxx 的形式,所以问题很可能是格式不一致,全部改成一样的即可:

# Social Links
# Usage: `Key: permalink || icon`
# Key is the link label showing to end users.
# Value before `||` delimiter is the target permalink, value after `||` delimiter is the name of Font Awesome icon.
social:
E-Mail: mailto:zoeyousa@gmail.com || fab fa-envelope
GitHub: https://github.com/Yousazoe || fab fa-github
Twitter: https://twitter.com/YousaZoe || fab fa-twitter
Weibo: https://www.weibo.com/6034231696/profile?rightmod=1&wvr=6&mod=personinfo&is_all=1 || fab fa-weibo
Steam: https://steamcommunity.com/profiles/76561198856466228/ || fab fa-steam
Chess: https://www.chess.com/member/yousazoe || fab fa-chess-pawn
RSS: /atom.xml || fab fa-rss

#GitHub: https://github.com/yourname || github
#E-Mail: mailto:yourname@gmail.com || envelope
#Weibo: https://weibo.com/yourname || weibo
#Google: https://plus.google.com/yourname || google
#Twitter: https://twitter.com/yourname || twitter
#FB Page: https://www.facebook.com/yourname || facebook
#StackOverflow: https://stackoverflow.com/yourname || stack-overflow
#YouTube: https://youtube.com/yourname || youtube
#Instagram: https://instagram.com/yourname || instagram
#Skype: skype:yourname?call|chat || skype

版本升级指南

npm install -g hexo-cli
hexo version

npm install -g npm-check
npm-check

npm install -g npm-upgrade
npm-upgrade

npm update -g
npm install -g npm

hexo clean #清理hexo数据并重新生成页面并部署
hexo g -s
hexo d

经过以上这些命令,整体翻新就差不多了,theme的升级,我这边是删除了原来的主题目录,重新进行了拉取,注意保留配置文件,重新配置即可,就不详述了。