Блог

Главная - Вопросы по программированию - Сбой загрузки CSS-файла на хостинге Firebase

Сбой загрузки CSS-файла на хостинге Firebase

# #css #firebase #firebase-hosting #firebase-cli

Вопрос:

1) Проблема

Я использую интерфейс командной строки Firebase (версия: 9.10.2), в частности, следующую команду

развертывание firebase-только хостинг

но я получаю ошибку.

2) Журнал отладки

 [debug] [2021-05-10T06:39:19.994Z] [hosting][upload] css/style.css (bb064334f47345caf59fb5942896d3eaefe67cfeed023d1b8ae121dcf2213c68) HTTP ERROR 409: [object Headers] Couldn't process request (status=409)
[debug] Task bb064334f47345caf59fb5942896d3eaefe67cfeed023d1b8ae121dcf2213c68 failed: retries exhausted after 6 attempts
[debug] [2021-05-10T06:39:19.996Z] [hosting][upload queue][FINAL] {"max":0,"min":9999999999,"avg":0,"active":0,"complete":1,"success":0,"errored":1,"retried":5,"total":1,"elapsed":21472}
[debug] [2021-05-10T06:39:20.311Z] Error: Unexpected error while uploading file.
    at Uploader.uploadHandler (/usr/lib/node_modules/firebase-tools/lib/deploy/hosting/uploader.js:187:19)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async Queue.executeTask (/usr/lib/node_modules/firebase-tools/lib/throttler/throttler.js:180:22)
    at async Queue.handle (/usr/lib/node_modules/firebase-tools/lib/throttler/throttler.js:96:22)
[error] 
[error] Error: Task bb064334f47345caf59fb5942896d3eaefe67cfeed023d1b8ae121dcf2213c68 failed: retries exhausted after 6 attempts

3) Файл CSS

Согласно журналу отладки, проблема находится в файле /css/style.css:

 @font-face {
    font-family: myFont;
    src: url('/fonts/AlexBrush-Regular.ttf');
}

.logo {
    font-family: myFont;
}

.bouncing-loader div {
    animation-duration: 0.5s;
}

.bouncing-loader div:first-child {
    animation-delay: 0.1s;
}

.bouncing-loader div:nth-child(2) {
    animation-delay: 0.3s;
}

.bouncing-loader div:nth-child(3) {
    animation-delay: 0.6s;
}

.spinning-loader {
    border-top-color: #3DDCAC;
    -webkit-animation: spinner 1.5s linear infinite;
    animation: spinner 1.5s linear infinite;
}

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

Я могу подтвердить, что проблема на самом деле связана с существованием хэш-символа #:

 .spinning-loader {
        border-top-color: #3DDCAC;
        -webkit-animation: spinner 1.5s linear infinite;
        animation: spinner 1.5s linear infinite;
}

Удаление # или лучше (для данного конкретного случая) замена #3DDCAC на rgba(61, 220, 172, 1) решает проблему.

4) Question

What might be causing such a problem?

Remark: This was not a problem in a previous Firebase CLI version

Метки: