vue中，引入动态路径的图片，不显示图片

Question

webpack配置如下：

const path \= require('path');  
const VueLoaderPlugin \= require('vue-loader/lib/plugin');  
  
module.exports \= {  
  module: {  
  rules: \[  
 {  test: /\\.vue$/,  
  loader: 'vue-loader'  
  },  
 {  test: /\\.js$/,  
  loader: 'babel-loader'  
  },  
 {  test: /\\.css$/,  
  loader: 'style-loader!css-loader'  
  },  
 {  test: /\\.less$/,  
  loader: 'style-loader!css-loader!less-loader'  
  },  
 {  test: /\\.(gif|jpg|png|woff|svg|eot|ttf)\\??.\*$/,  
  loader: 'url-loader',  
  options: {  
  limit: 10000  
  }  
 }, {  test: /\\.(html|tpl)$/,  
  loader: 'html-loader'  
  }  
 \] },  
  resolve: {  
  alias: {  
  '@': path.join(\_\_dirname, '../src'),  
  vue: 'vue/dist/vue.esm.js'  
  },  
  extensions: \['.js', '.vue', '.json'\]  
 },  
  plugins: \[new VueLoaderPlugin()\]  
};

然后再vue组件中这样引入：
style['background-image'] = 'url(' + require(`./i/${this.type}.png`) + ')';

我把style打印出来，结果控制台出现：
{"background-image":"url([object Module])"}

没有显示图片信息，请问是什么原因？

Answer 1

url-loader的options里面添加esModule: false