app开发html <img src=,webpack打包html里面img后src为“[object Module]”问题

在html中引入img图片

Document1

使用url-loader/file-loader结合html-loader打包

{

test: /\.(png|jpg|gif|jpeg)$/,

use: [{

loader: 'url-loader',

loader: 'file-loader',

options: {

name: '[name].[ext]',

limit: 10240

}

}]

},

{

test: /\.(htm|html)$/,

loader: 'html-loader'

}

发现打包后html里面，img的src为[object Module]，

但是如果使用"file-loader": "^4.2.0"或者"file-loader": "^2.0.0"却可以正常打包

后来发现file-loader在新版本中esModule默认为true，因此手动设置为false

{

test: /\.(png|jpg|gif|jpeg)$/,

use: [{

loader: 'url-loader',

// loader: 'file-loader',

options: {

esModule: false, // 这里设置为false

name: '[name].[ext]',

limit: 10240

}

}]

}

这样就可以正常打包了