先说明环境:
项目是由 create-react-app 创建, eject 填充配置的;
dev 正常, build 未产生报错
webpack.config.prod.js 中关于图片引入的配置未更改;
server中已加入:
import assethook from 'asset-require-hook';
assethook({
extensions: ['jpg', 'png', 'gif', 'webp'],
});
代码是很正常的引用:
const default_avatar = require('../static/pic/avatar.png') //import 也同样的报错
<img src={default_avatar} alt=""/>
报错情况:
XXX.png: Unexpected character '�' (1:0)
后来使用 css 引入才解决:
.avatar {
background: url("../static/pic/avatar.png") no-repeat;
background-size: 100%;
}
但是还是向请教下,在 js 文件中该如何正确的引入!!