SPFX webpart referencing images in html

Question

I'm creating a simple SharePoint webpart using SPFX, I wanna reference images in the solution. I used this method:

require("@microsoft/loader-set-webpack-public-path!");

<img src="${require<string>('../../assets/logo.jpg')}" alt="My Company" />

But it doesn't work.

How to achieve that ?

Answer 1

Sample test demo:

No framework:

<img src="${require<string>('../../download.jpg')}" alt="My Company" />

React framework:

<img src={require('../../assets/panda.jpg')} alt="test" />