Vue.js 1.0 自定义指令可以异步请求后面吗

Question

我想写一个自定义指令功能是针对浏览器支持webp格式就是用webp格式的图片不支持就使用原图。
然后判断浏览器是否支持webp是一个异步的过程。
我可以写成这样的代码么：

img.onload{
    Vue.directive('webp', {
        bind: lazyLoadHandler,
        update (newValue, oldValue) {},
        unbind () {}
    })
} 

问题1：这个指令是需要单独提成一个文件然后在需要使用的地方使用Vue.use(VueWebp)来使用的