How to import image (.svg, .png ) in a React Component

Question

I am trying to import an image file in one of my react component. I have the project setup with web pack

Here\'s my code for the component

import Di         


        

Answer 1

If the images are inside the src/assets folder you can use require with the correct path in the require statement,

var Diamond = require('../../assets/linux_logo.jpg');

 export class ItemCols extends Component {
    render(){
        return (
            <div>
                <section className="one-fourth" id="html">
                    <img src={Diamond} />
                </section>
            </div>
        )
    } 
}