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.
Try default import: import portfolio from './portfolio.png'.
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>
);
}
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
