Can't find file path of image in reactjs-CodePudding

None of the images I have saved locally can be found when trying to import them in my project.

import {portfolio} from './portfolio.png'

Leads to "Cannot find module './portfolio.png' or its corresponding type declarations.ts(2307)".

The image file path is 100% correct.

Update: Image loads however I would like to know how to remove the typescript error.

CodePudding user response：

Try default import: import portfolio from './portfolio.png'.

CodePudding user response：

Hey @Joe there are multiple ways to call images- first-

import image from './porfolio.png'

second, in this method you need to post image inside public images folder-

<img src="/images/image.png"/>

Hope these methods help you to solve your query, if you still facing issue just lemme know, I will hlep you. Thanks

CodePudding user response：

Use the ES6 standard to import images into react.

If in public use the absolute path.

If it is in src you can use relative path.

https://create-react-app.dev/docs/adding-images-fonts-and-files/

import MyImage from './logo.svg'; # In local
import MyImage from 'images/logo.svg'; # In Public

export default function App() {
   return(
     <div>
       <img src={MyImage} alt="logo" />
     </div>
   );
}