HTML-файл Git live preview не работает

#html #github

Вопрос:

Я работаю над проектом odin и создаю свой первый html-проект, первый проект рецепта. Теперь я закончил его и загрузил в свой репозиторий на github. Если я хочу увидеть это с помощью предварительного просмотра в реальном времени, то index.html страница работает хорошо. Но если я нажму на ссылку на странице индекса, она не будет работать. Можете ли вы проверить мой html-файл? Или, может быть, у меня произошел сбой в рабочем процессе github. Я изменил/закончил кодирование в MS VisualStudio, а затем добавил следующие инструкции в терминал:

 git add .
git commit -m "something"
git push origin main

Мое Репо:
https://github.com/ztrk-dev/odin-recipes/tree/main/recipes

1. GitHub не является хостинг-провайдером (за исключением страниц GitHub), поэтому переход по ссылкам на HTML-страницах вряд ли приведет к чему-то интересному, поскольку для этого требуется хост, веб-сервер, настроенный для обслуживания HTML в соответствии с правилами HTTP. Предварительный просмотр в режиме реального времени обеспечивает возможность предварительного просмотра одного HTML-файла отдельно.

Ответ №1:

Вы размещаете то, что страницы Github называют сайтом проекта, что означает, что страница размещается на «username.github.io/repository«.

Причина , по которой страницы с изображениями загружаются не так, как ожидалось(если я неправильно понял вопрос, дайте мне знать), заключается в том, что они связаны как /images/spaghetti-napoli.jpeg , что является относительным путем к файлу spaghetti-napoli.jpeg это находится в папке «изображения», расположенной в корневом каталоге. Проблема в том, что корневой каталог / не является базовым каталогом сайта вашего проекта. /{repo-name}/ есть (чтобы у вас могло быть много разных проектов с их собственными сайтами, если бы вы захотели).

Если вы хотите, чтобы репозиторий был корневым для вашего сайта, вам понадобится сайт пользователя, для которого потребуется репозиторий с именем ztrk-dev.github.io для размещения файлов проектов. Если вы предпочитаете использовать сайт проекта, вам нужно будет связать изображения как /{repo-name}/{path-to-file} вместо /{path-to-file} .

То /images/spaghetti-napoli.jpeg есть стал /odin-recipes/images/spaghetti-napoli.jpeg бы или ../images/spaghetti-napoli.jpeg