Hexo使用本地图片

在初次使用 Hexo ,编写第一篇文章的时候,就碰到了问题。

那就是在 md 文件中,引用的图片,在本地编辑器是可以查看的,而在本地启动的网站,或者部署到 Github 的网站中,都不能正常展示。

原因很简单,就是 通过常规的 markdown 语法和相对路径来引用图片和其它资源导致它们在网站上找不到资源。

其实 Hexo 官方文档中提供了插入图片的语法,具体请查看 文档

1
{% link text url [external] [title] %}

但是,当我们在 md 文件中,使用这样的语法时,在本地编辑器中,是无法查看图片的。

我不太喜欢这种写法,于是继续寻找其他的方法。

hexo-asset-image

hexo-asset-image 是一个 自动为 Hexo 中的资源图像指定绝对路径 的插件。

安装很简单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/hexo/malideBlog $ npm install https://github.com/CodeFalling/hexo-asset-image --save

added 21 packages, and audited 306 packages in 10s

43 packages are looking for funding
run `npm fund` for details

12 vulnerabilities (2 low, 1 moderate, 5 high, 4 critical)

To address all issues possible (including breaking changes), run:
npm audit fix --force

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.
/hexo/malideBlog $ hexo clean

问题

当我直接使用命令 npm install hexo-asset-image --save 安装 hexo-asset-image 时,安装好的插件,似乎不太对,并不能正确的将我图片资源的路径转换为绝对路径。

我对前端不是很在行,没有深究原因的条件,只是进行一个记录。