I am making a ReactJs website and when I try to add image to my website using img tag, it does not work when I specify the path of the image in the src attribute of the img tag but works when I first import the image using import and add that variable in src.

import React from "react";
import imagePath from '../assets/images/img1.jpg'
function ImageSlider() {
  return (
    <section className="bg-red-300 h-full ">

Does work

   <img src={imagePath} alt="img1" className="h-full" /> 

Does not work

     <img src="../assets/images/img1.jpg" alt="img1" className="h-full" />
        
       
     </section>
  )
}

export default ImageSlider;