在Hexo中我踩过的坑

为什么要开这篇文章?就是因为我这两天已经被Hexo折腾得够呛!

诚然,Hexo一键部署博客给写作带来了很大的便利,但是不可否认的是,Hexo的错误让人摸不到头脑,只有反复尝试才能得出正确结果。

因此,奉劝大家,不要瞎升级Hexo!不要瞎改动Hexo!不要瞎折腾Hexo!

这里记录下我踩过的各种坑,留给大家排坑,也方便自己以后查找问题。

nature.jpg

Hexo升级3.0版本

如果你现在用的是2.x版本,我强烈建议不要升级!因为大家用到的Hexo功能肯定都是简单的那几个命令,Hexo的2.x版本完全够用,升级很容易出问题!别问我为什么知道!

如果你一定要升级的话,记住Hexo的3.x版本的安装命令是:

1
npm install -g hexo-cli

昨天因为折腾,安装速度还很快,今天不知道为什么了,速度非常之慢,用了Hexo淘宝镜像也很慢。需要镜像的可以参考这个文章:修改npm包管理器的registry为淘宝镜像(npm.taobao.org)

Hexo同时部署到多个Git仓库

网上的教程很多,但是试了之后感觉都不行,会报错!亲测下面的方法可以用!

在_config.yml中的deploy中这么写:

1
2
3
4
5
6
7
deploy:
- type: git
repo: cfg@165.227.00.000:/var/repo/hexo_static
branch: master
- type: git
repo: git@github.com:fuxuemingzhu/fuxuemingzhu.github.io.git
branch: master

把仓库的地址修改成你的Git地址。

如果你使用的是Github的仓库,查看仓库地址的方式是在这里,记得切换成ssh模式查看。

github仓库地址

Hexo文章中用相对路径方式插入图片

这个坑大家可能都感觉遇到过,其实这不是个坑。

因为大家写博客就是公开的,完全可以把图片放到一个公开的图片网站再引用即可。但是我感觉不太好。

这种方式莫名其妙地把图片放到了一个你可能完全不会去访问的网站,很难管理,如果想删除图片也比较麻烦,甚至无法删除。

我之前的做法是放到自己的Github仓库中,然后引用自己仓库的图片的网址。这样不错,只不过图片要先上传一次,然后才能在博客里使用。

正确做法是在Hexo中采用相对路径方式插入图片。步骤如下。

  1. 首先在hexo目录下安装插件:
1
npm install https://github.com/CodeFalling/hexo-asset-image --save
  1. 然后,把打开_config.yml开关。这样新建每个文章都建一个同名的图片的文件夹,用于管理。
1
2
_config.yml
post_asset_folder: true
  1. 把图片放到文章的同名文件夹之下,在博客中用以下的hexo命令插入图片,注意不用填写路径,直接写图片名字!
1
{% asset_img github.png github仓库地址 %}

上面这个代码的结果就是上一节中github仓库的那张图片的代码。

这个是图片放的位置:

1
{% asset_img posts.png 图片放的位置 %}
图片放的位置

在public文件夹下会生成对应资源图片:

1
{% asset_img public.png 生成的图片 %}
生成的图片

使用以上的代码就能看到效果了~

更多信息可以看官方文档:资源文件夹

有得有失,这样做的时候就不能再markdown源文件中查看到图片了。

page页面图片不能采用相对路径

博客的文章页面是可以采用相对路径寻找图片的,正如上文所述。可是,今天发现如果是一个page页面(可以通过侧边栏直接访问的),相对路径就不起作用了。。不是找不到图片的问题,而是如果是page页面采用asset_img的方式根本就不会识别出这里要插入图片。。

因此,解决的办法是直接采用markdown方式插入图片就好了,虽然有点不那么优雅……

后续补充

……

参考资料:

如果满分10分,你会给这篇文章打几分?
负雪明烛 微信

微信

负雪明烛 支付宝

支付宝