Изображения не отображаются для страницы Github (приложение create-response-app) с пользовательским доменным именем

У меня есть приложение React, которое я разместил на страницах Github. Первоначально после выполнения шагов, описанных здесь: https://medium.com/@hossainkhan/using-custom-domain-for-github-pages-86b303d3918a Я видел только пустую страницу. Изучив другие вопросы S / O, я понял, что мне нужно отредактировать файл index.html, как сказано в этом сообщении здесь: размещение gh-страниц в персональном домене, белая пустая страница Это сработало, и сайт теперь работает:

https://www.mohaiminalaoun.com

Однако у меня также есть несколько изображений SVG, которые не отображаются.

Мой файл index.html: https://github.com/mohaiminalaoun/mohaimin/blob/gh-pages/index.html

Ошибка в консоли: GET https://mohaiminalaoun.com/mohaimin/static/media/face.01df9ea9.svg 404, что имеет смысл, потому что это не должен быть путь.

В файле index.html я попытался изменить путь с «/mohaimin/face.svg» на «/face.svg» и снова на «/static/media/face.svg», а затем даже попытался указать прямой href: https://mohaiminalaoun.com/static/media/face.01df9ea9.svg, но ни один из них не работает на развернутой странице.

Я не уверен, как / нужно ли мне снова отредактировать файл index.html, чтобы исправить изображения svg.

ОБНОВЛЕНИЕ: в опубликованном домене файл svg в /static/js/face.svg имеет только одну строку module.exports = __webpack_public_path__ + "static/media/face.01df9ea9.svg"; Я предполагаю, что это нужно как-то изменить, но пока не могу понять, как это сделать.


reactjs github-pages google-domains
person McFiddlyWiddly    schedule 20.11.2019    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Вы указываете неправильное место.

Измените свой src с /mohaimin/static/media/face.01df9ea9.svg на /static/media/face.01df9ea9.svg

Изменить: если вы хотите знать, как найти местоположение.

https://github.com/mohaiminalaoun/mohaimin/tree/gh-pages

По сути, это ваш корень. Все, что находится за пределами папки, находится по адресу https://mohaiminalaoun.com/FILE.

Например: face.svg на ваших gh-страницах находится по адресу https://mohaiminalaoun.com/face.svg.

person Nathan    schedule 20.11.2019
comment
Вы хотите сказать, что я должен отредактировать файл index.html и изменить href на /static/media/face.01df9ea9.svg или /static/media/face.svg? - person McFiddlyWiddly; 21.11.2019
comment
Вы можете использовать / static / media / face. 01df9ea9.svg или /face.svg - person Nathan; 21.11.2019
comment
Я изменил его на /face.svg, но на mohaiminalaoun.com все еще возникает та же проблема. - person McFiddlyWiddly; 21.11.2019

arrow_upward
0
arrow_downward

Проблема заключалась в том, что, как было добавлено в обновлении, общедоступный URL-адрес был mohaiminalaoun.github.io/mohaimin, а webpack построил файл svg так, чтобы он имел module.exports = webpack_public_path + "static / media / face. 01df9ea9.svg "как единственный контент. Полный путь не существует, потому что после изменения CNAME путь должен быть просто доменным именем.

Поэтому вам просто нужно обновить переменную домашняя страница в package.json до mohaiminalaoun.com с mohaiminalaoun.github.io.

person McFiddlyWiddly    schedule 21.11.2019