0

введите сюда описание изображенияПривет!Когдая пытаюсь добавить картинку на сайт то получаю вот такую ошибкувведите сюда описание изображения

Использую react-create-app.

 import React, { Component } from 'react';
import '../App.css';
import FaAlignJustify from 'react-icons/lib/fa/align-justify';
class Header extends Component {
     render() {
         return(
         <div>
             <FaAlignJustify />
             <img src="D:\projects\portland.com\src\images\portland.png" alt="portlandlogo"/>
             <div>
                 <ul>
                     <li>Home</li>
                     <li>Devices</li>
                     <li>Delivery & Payment</li>
                     <li>Guarantee</li>
                     <li>About Us</li>
                 </ul>
             </div>
         </div>);


    }
}

export default Header;

Расскажите пожалуйста с чем это связано и как решить эту ошибку?

Изменил путь на вот такой <img src="./images/portland.png" alt="portlandlogo"/> и ошибка исчезла, но картинка по прежнему не отображаетсявведите сюда описание изображения Структура папок

1
  • Да, действительно. у меня было так - Папка src содержала и components и assets, подумал так быстрее путь прописать. Работает только из паблика, предполагаю, что из за того что когда это все компилится, он в src только код хочет видеть и некаких больше вечеринок. 6 мая 2023 в 18:22

3 ответа 3

0

Судя по структуре сайта, путь к картинке должен быть таким:

<img src="../images/portland.png" alt="portlandlogo"/>

Сейчас вы пытаетесь загрузить картинку из той же директории где лежит Header, вам нужно выйти из директории Components в src. Почитайте про относительные и абсолютные пути, когда нужна ./ а когда ../

Решение: Переместите папку images в public, а в src напишите /images/portland.png

6
  • Все равно не работает 3 фев 2018 в 14:01
  • Сейчас обратил внимание, что у вас в примере кода portland.png, а на скрине из студии portland.jpg. Расширение совпадают?
    – 0xSA
    3 фев 2018 в 14:04
  • Добавил скриншот,разные форматы изза того что тестировал вдруг с расширением что то не так. 3 фев 2018 в 14:06
  • Переместите папку images в public и в src напишите /images/portland.png
    – 0xSA
    3 фев 2018 в 14:08
  • Работает))Но теперь мне вобоще не понятно как так получается что в public работает а в src -нет. 3 фев 2018 в 14:30
0

нужно ставить картинку в ту папку, где находиться индекс.хтмл файл и путь писать от туда. тогда все гуд

1
  • Полагаю, Вы, немного опоздали, вопрос был задан 4 года назад)
    – dhelfy
    26 июн 2022 в 12:08
0

Возможно, будет полезно таким же новичкам, как я. Изображения или папку к ним нужно помещать обязательно в public

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.