<img style={{ width: '100%', height: '100%' }} src='../../../../../assets/images/doctor.png' />
代码这样使用,不管是使用相对路径还是绝对路径,打包都是不可
解决方案:
webpack的配置,如下,在loader里加上
{
test: /\.(jpe?g|png|gif)$/i, //图片文件
use: [
{
loader: 'url-loader',
options: {
limit: 10240,
fallback: {
loader: 'file-loader',
options: {
name: 'img/[name].[hash:8].[ext]'
}
}
},
}
],
include: path.resolve(__dirname, '../../src/assets/images')
},
使用的时候,使用require导入
<img style={{ width: '100%', height: '100%' }} src={require('../../../../../assets/images/doctor.png')} />