背景

又水一篇博客吧，我博客的图片都是配置在又拍云上，然后绑定了自己的域名信息，
但是后来一不小心，把域名卖了，我也没想到挂500块都能半小时卖掉，卖完才想起来，
域名和图片的url绑定在一起了，我现在只有把markdown中图片url的域名信息一个一个修改掉
太麻烦了，如果后面再换域名，那么这些图片url中的域名信息又要改一次，
能不能将图片url中的域名信息写成一个变量，然后在hexo的配置文件中定义一个变量呢
这样，以后我如果换了域名，那么我只需要修改hexo配置文件的变量值，则hexo文章中所有图片url
的域名信息就全部改过来了，但是这样也有缺点，就是这个改完后的markdown文章，它的图片url
域名部分是个变量名，如果你换成别的静态页面框架，或者想把文章放在wordpress中，是不能直接拷贝放的
因为这个变量名只在hexo框架中被解析，除非新的框架也能提供方法去解析markdown中的变量名
这是个新问题，不过先不管了，如果是放在hexo框架中就没事，哪怕是换主题都行。

下面来看看具体怎么改

  • 首先在主题的配置文件中定义域名的变量，我使用的是hexo-theme-yun主题，所以在_config.yun.yml文件中修改

    #自定义图片存储前缀
imgPrefix: http://cdn.keyiup.com

  • 然后在hexo的根目录下创建一个scripts目录，在里面写一个js文件，名字随便取

    #我取的文件名是imgPrefix.js，文件名随便
hexo.extend.tag.register('imgPrefix', function(args) {
  return hexo.theme.config.imgPrefix;
});

#上面代码中就是得到主题的配置文件中的imgPrefix变量值

  • 最后在markdown文章中使用

    {%imgPrefix%}
就能解析成：http://cdn.keyiup.com

然后我的图片就是改成这样：<img src="{%imgPrefix%}/blog/一个重要的关系.png"/>

需要注意的是，这个变量名解析是不能和markdown的语法使用在一起的，所以我们不能这样写
![]({%imgPrefix%}/blog/一个重要的关系.png)

只能写成html的形式才能被解析出来