Могу ли я импортировать изображение png / jpg как компонент? Реагировать. js

Question

Я делаю личный проект по реакции. js но я бы хотел написать чистый код. Есть ли способ импортировать изображение png в компонент или что-то в этом роде? Я попытался преобразовать его в изображение svg, но большинство страниц конвертера не работают. Если не может быть преобразован. Вы можете ответить красивой страницей конвертера. спасибо

например

import { ReactComponent as AppIcon } from '../assets/img/icon_app.svg

и импортируйте его вот так

<AppIcon />

Answer 1

Да, вы можете сделать это так:

import yourImage from "./<path_to_png>/image.png"

Тогда используйте это так:

<img src={yourImage} />

Answer 2

, если вы используете приложение Create React, у вас уже есть загрузчик ссылка здесь
, иначе вы можете использовать загрузчик для объединения img url-loader

тогда вы сможете это сделать
import MyImage from 'path/to/img.png'
и в теге
<img src={MyImage} />

Или вы можете обслужить png и добавить ссылку на img отметьте как
<img src="http://your-host.com/your-img.png" />