个人博客网站搭建中遇到的问题以及解决办法

1. hexo deploy卡死或报错

这是我最近遇到的问题,困扰了很长时间!

主要问题时因为hexo deploy中上传的内容比较大,而git push过程的是2B/s,直接导致最终上传不上去或者服务器返回超时或者ssl方面的错误。

解决办法:挂代理

1
2
3
4
5
6
7
git config --global https.proxy http://127.0.0.1:1080
git config --global https.proxy https://127.0.0.1:1080
git config --global --unset http.proxy
git config --global --unset https.proxy
npm config delete proxy

2. 文章目录层级结构显示不全

我们在使用侧边栏的时候,可能会有将文章目录结构全部显示的需求,但next/_config.yml不论如何设置都不会成功。这个时候就需要改源码。

next/source/css/_common/components/sidebar/sidebar-toc.styl

1
//.post-toc .nav .nav-child { display: none; }

将上面那行注释掉即可

3. 文章目录自动无序列表

当文章中没有1、2、3这样的章节标题设置时,我们很容易忽略层级关系;但是若加上1、2、3这样的章节标题,且next的toc设置中启用了自动添加数字时,就容易产生1.1.这样多次显示章节序列的问题。

解决办法:参考issue

next/_config.yml

1
2
3
4
5
6
# TOC in the Sidebar
toc:
enable: true
# Automatically add list number to toc.
number: false

将toc中的number设置为false

4. 取消特效

next特效虽然好看,但是会让页面加载缓慢!所以我取消了特效

1
use_motion: false

5. 侧边栏太宽

由于next/source/js/src/motion.js将侧边栏设置宽度设置为320px,所以无论浏览器页面宽度多少,最终显示的都会是320px,这严重影响了观感。所以我修改了motion.js

1
2
//var SIDEBAR_WIDTH = '320px';
var SIDEBAR_WIDTH = '20vw'; //页面宽度的20%

另外就是sidebar-dimmer有些许不友好,所以我也进行了相应的修改

next/source/css/_common/components/sidebar/sidebar-dimmer.styl

1
2
3
4
5
6
7
8
//-webkit-transform: translateX(-150%);
-webkit-transform: translateX(-100%);
//transform: translateX(-150%);
transform: translateX(-100%);
//width: 200%;
width: 100%;