Я установил React с помощью приложения create-react-app
. Он установлен нормально, но я пытаюсь загрузить изображение в один из моих компонентов (Header.js
, путь к файлу: src/components/common/Header.js
), но он не загружается. Вот мой код:
import React from 'react';
export default () => {
var logo1 = (
<img
//src="https://s3.amazonaws.com/codecademy-content/courses/React/react_photo-goose.jpg"
src={'/src/images/logo.png'}
alt="Canvas Logo"
/>
);
return (
<div id="header-wrap">
<div className="container clearfix">
<div id="primary-menu-trigger">
<i className="icon-reorder"></i>
</div>
<div id="logo">
<a href="/" className="standard-logo" data-dark-logo='/images/logo-dark.png'>{logo1}</a>
<a href="/" className="retina-logo" data-dark-logo='/images/[email protected]'>
<img src='/var/www/html/react-demo/src/images/[email protected]' alt="Canvas Logo" />
</a>
</div>
</div>
</div>
);
}
Если я напишу путь к изображению как src={require('./src/images/logo.png')}
в моей переменной logo1
, это выдаст ошибку:
Не удалось скомпилировать.
Ошибка в. /src/Components/common/Header.js
Модуль не найден:./src/images/logo.png в /var/www/html/wistful/src/Components/common
Пожалуйста, помогите мне решить это. Дайте мне знать, что я делаю не так здесь.