Hexo 图片无法显示问题

图片不显示问题

Hexo的source文件夹下，除了存放博客的md文件，还可以存放博客需要的图片，并通过Markdown引用图片的语法，引用图片到文章。

1	![图片名称](图片相对路径)

在启动本地服务器后，本地测试图片显示没有问题。当把文章部署到git之后，远程访问图片会出现不显示的问题。因为图片的相对路径在source文件夹下和public文件夹下的相对路径不一致，public文件夹下会在图片的相对地址前加上年月日文件结构，因此访问不到。

一般有两种解决方法：

图片存在本地source文件夹下和md文档同名的资源文件夹下，通过使用图片标签插件，使用相对路径引用图片。

打开hexo文件夹根目录下的 _config.yml配置文件，将post_asset_folder设置为true。

1
2
3

_config.yml

post_asset_folder: true

在新建文章时，_post文件夹下除了md文档外，还会出现同名文件夹用来存放图片，如下图。

Figure 1 资源文件夹

安装hexo-asset-image插件，用来自动转换图片路径。

1 2	$ cd hexo博客目录 $ npm install https://github.com/CodeFalling/hexo-asset-image --save

将需要md文章中需要饮用的文件放在同名资源文件夹中，通过标签插件直接引用。格式为{ %asset_img 图片名称.图片格式 [title] %}。标签插件会将自动转化图片的相对路径和public种的日期文件结构一致，解决路径不一致问题。

图床是将要引用的图片放在可托管的服务器上，在文章中引用服务器上图片的绝对地址，同样不会造成图片文件路径不一致的问题。