1//if you have images in src folder
2import shoe1 from './img/shoe_01.jpg'
3const Shoe = (e) => {
4 return (
5 <div className="shoe-container">
6 <img src={shoe1} alt=""/>
7 </div>
8 );
9}
10//if you have images in public folder:
11//will look in folder /public/img/shoe_01.jpg
12const Shoe = (e) => {
13 return (
14 <div className="shoe-container">
15 <img src="/img/shoe_01.jpg" alt=""/>
16 </div>
17 );
18}
19
1// Assuming logo.png is in the same folder as JS file
2import logo from './logo.png';
3
4// ...later
5<img src={logo} alt="logo" />
1// Assuming logo.png is in the same folder as JS file
2import logo from './logo.png';
3
4// ...later
5<img src={logo} alt="logo" />
6
1//import imgs in a different js file
2import lostImage from './assets/img/illustrations/lost.svg';
3export { lostImage };
4
5//import in the component to use it
6import {lostImage} from './images.js'
7
8