Изображения, которые не отображаются на размещенном сайте

Question

Спасибо, что нашли время, чтобы посмотреть на это, я исследовал как можно лучше, но не придумал ничего. Я видел подобный пост переполнения стека о ожидании обработки изображений, но я ждал около 2,5 часов, и изображения все еще отсутствуют.

Я использую angularfire с Firebase. Я использую сборку grunt для создания папки dist, и именно это я развертываю в Firebase. В папке dist содержится папка с изображениями, и firebase сообщает, что она загружает 780 файлов при ее развертывании (до того, как я добавил изображения, это было около 25).

Однако изображения, похоже, не отображаются. Шаблон URL-адреса my-app.firebaseapp.com/images/image-name.jpg

Мой файл firebase.json показан ниже, это довольно просто.

{ 
    "firebase": "<redacted>", 
    "public": "dist", 
    "ignore": [ 
    "firebase.json", 
    "**/.*", 
    "**/node_modules/**" 
    ] 
} 

Приложение само развертывает только отлично и работает, все изображения всего 404. Я заранее извиняюсь за то, что я угадываю, это что-то очень основное, что мне не хватает.

Answer 1

Итак, я как бы решил проблему. В процессе сборки Grunt's imagemin делала «что-то» с изображениями, из-за которых они не отображались. Я выясню, что в конечном итоге и, надеюсь, не забудьте обновить этот пост, если другие встретятся с этим в будущем. Но в то же время просто заменив созданную папку с изображениями, исправил проблему.

Answer 2

Это, вероятно, потому, что src, rel и href теги содержат absolute url с, что вызывает firebase проблемы при получении в правый файл. Что вы должны сделать, так как все URL-адреса должны быть относительными, например: images/image1.png , вы должны сделать это даже с помощью ссылок css и js. Кроме того, вы должны хранить все в папке с именем public, или вам нужно будет изменить имя в своем каталоге, когда будет предложено в командной строке использовать конкретную директорию как общедоступную.