Я пытаюсь загрузить статическое изображение в свой компонент с именем Top.js, поэтому у меня есть импортное изображение, как показано ниже в Top.js:
import logo from './images/logo.png'
путь для logo.png - frontend/src/images/logo.png .
После этого я пытаюсь использовать это в своем JSX в компоненте, как показано ниже:
<img src="{logo}" alt="Homepage" />
Компонент успешно загружается, но не показывает изображение логотипа. Следуя решению подобных проблем, я также настроил конфигурации веб-пакета, но он все еще не работает.
Вот моя конфигурация веб-пакета для среды разработки.
путь для веб-пакета внутри моего корневого каталога выглядит следующим образом:
`frontend/node_module/react-scripts/config/webpack.config.dev.js`
перейдя по ссылке, я внес изменения в конфигурацию следующим образом:
test: /\.(pdf|jpg|png|gif|svg|ico)$/,
use: [
{
loader: 'url-loader'
},
]
После этого я снова запустил свое приложение с помощью npm start, и оно запустилось успешно, но изображение логотипа не отображается.
Я использую [email protected] для интерфейса с серверной частью Koa.js и [email protected]
