hexo插入图片

hexo插入图片

总结一下hexo中插入图片的几种方法。


图床插入图片

使用sm.ms或者新浪图床之类的图床,也可以是七牛云oss等。

插入语法:

1
![pic_title](url)

优点是在任何联网的场景都可以查看,而且可以缓解服务器的带宽压力,明显提高网站性能。

缺点是图床毕竟不是自己的服务器,之前一直用的微博图床就出现了防盗链导致我的原博客所有图片失效,第二个缺点就是使用图床的话只能在联网的环境下才能查看到图片。


本地插入图片

就是将图片防止在markdown文件所在的目录中。

优点是图片永远不会丢失。

缺点是图片会占用服务器存储空间、带宽。以及在hexo中本地插入图片有些不方便。

流行的方式:

  1. 首先在hexo根目录下打开_config文件,查找到post_asset_folder,修改为post_asset_folder: true

    该配置会使得hexo new 'post_title'的时候在_posts目录中自动生成一个与文章同名的文件夹用来存放资源。

  2. 安装hexo-asset-image插件

    1
    $ npm install https://github.com/CodeFalling/hexo-asset-image --save
  3. 将文章图片拷贝至同名文件夹下,记住图片文件名,现在只需要插入到markdown中,直接![pic_title](pic_name.jpg)即可。如下:

    1
    ![pic_title](pic.jpg)
  4. 完成

网上流行这种方式,hexo的确可以正常显示图片。不过在markdown中就无法显示图片了,因为这种路径是相对于public目录中图片的目录的,在markdown编辑的时候路径错误故而无法正确显示图片。

我的方法:

最后还是上传到了图床sm.ms

评论