React can't get the pit of the file in the directory

Today I use the img tag of react, and I want to show a picture. This is my directory structure:

When I want to use the pictures in the static folder:

<img src="./static/logo192.png" />

It was found that the picture could not be found, and the picture was not displayed.

Um? Obviously there is no problem with the path...

As a result, after a period of research, the following three solutions were summarized:

Solution 1: Use require to modify the path:

<img src={require('./static/logo192.png')} />

Option II:

Introduce and use the picture through import.

import logo192 from "./static/logo192.png"

......

<img src={logo192} />

third solution:

Save the static files in the built-in public folder and use them directly through "./XXX".

<img src="./logo192.png" />

//此时文件在public目录下

The picture shows success!

I hope this article will help you ^_^

Easter eggs:

This article is of low quality and will not get more traffic support!

This article is of low quality and will not get more traffic support!

This article is of low quality and will not get more traffic support!

This article is of low quality and will not get more traffic support!

This article is of low quality and will not get more traffic support!

This article is of low quality and will not get more traffic support!

This article is of low quality and will not get more traffic support!

ummmmm。。。TAT

Guess you like

Origin blog.csdn.net/qq_58174484/article/details/125679589