I am getting the following error while running react app:

Failed to compile.

Module not found: Error: Can't resolve ' ../asset/intro.jpg' in 'C:my-appsrccomponents'
ERROR in ./src/components/HeroImg.js 7:0-43
Module not found: Error: Can't resolve ' ../asset/intro.jpg' in 'C:my-appsrccomponents'

webpack compiled with 1 error

HeroImg.js

import "./HeroStyles.css";
import React from 'react';
import {Link} from "react-router-dom";
import IntroImg from " ../asset/intro.jpg";

const HeroImg = () => {
  return (
      <div className="hero" >
       <div className="mask">
        <img className="into-img" src={IntroImg} alt="introimage"/>
       </div>

       <div className="content">
         <p>HI, I'M A FREELANCER.</p>
         <h1>React Developer</h1>
         <div>
          <Link to="/project" className="btn">Projects</Link>
          <Link to="/contact" className="btn btn-light">Contact</Link>

         </div>

      
      
       </div>
      </div>
  );
};
export default HeroImg

ollowing is the folder hierarchy:
-src

-asset

   -intro.jpg

I am new to react and following a tutorial. I have write as it is as the code in the tutorial and I have also checked it so many times..
I have check the path, it is written correctly, I tried to configure this error using require statement but not working for me….

Anyone can help me out configuring this error….