使用vue-loader不必require圖片

以前在寫vue的時候，經常要寫這樣的代碼，把圖片提前require給一個變量，然後再把變量傳給組件(注意是組件，不是原生的東西,不是原生如img)：

<template>
 <div>
   <avatar :default-src="logoUrl"></avatar>
 </div>
</template>
<script>
  methods:{
    logoUrl(){
      return require("`../../assects/img/logo.png`")
    }
  }
</script>

通過vue-loader的transformToRequire，可簡化代碼：

{
  vue:{
    transformToReuire:{
      avatar:['default-src']
    }
  }
}

於是，我們的代碼就變成了這樣：

<template>
 <div>
   <avatar default-src="../../assects/img/logo.png"></avatar>
 </div>
</template>
<script>
  //methods:{
  //  logoUrl(){
  //  return require("../../assects/img/logo.png")
  //  }
  }
</script>