I can't use images from local files in react

ProfilePage.js

import React from 'react'

export default function ProfilePage() {
    return (
        <div>
            <div className='bg-slate-500 rounded-3xl text-center items-center'>
                
                <img className='w-full h-16' src='/src/images/backgroundImage.jpg' alt='couldnt find' />
            </div>
            
        </div>
    )
}

I’m getting a 401 unauthorized error.

How can i use images in react ?

>Solution :

In order to load local images to your React.js application, you need to add import your file.

import backgroud_image from "/src/images/backgroundImage.jpg";
<img className='w-full h-16' src={backgroud_image } alt='couldnt find' />