Включить и ссылаться на изображение в ответ на webpack

Question

Каков наилучший способ включения и ссылки изображений для взаимодействия с реакцией в одностраничном приложении JavaScript для сборки и в комплекте с webpack?

До сих пор у меня есть

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

Есть ли лучший способ?

Answer 1

Если вы используете Webpack's url-loader, вы можете сказать ему, чтобы он автоматически вставлял данные uri, если размер файла ограничен указанным лимитом.

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