包含并引用与webpack反应的图像

Question

在单页面JavaScript应用程序构建中包含和引用图像以及与webpack捆绑在一起的最佳方法是什么？

到目前为止我有

return (<img src={require('./pic.png'}</div>)

有没有更好的办法？

Answer 1

如果您使用 Webpack 的url-loader，您可以告诉它在文件大小低于指定限制时自动嵌入数据 uri。

require("url?limit=10000!./pic.png");
// => DataUrl if "pic.png" is smaller that 10kb