Favicon не обновляется в React? Вот решение
Вы заменили файл, а вкладка сохранила старую иконку. В React-приложении это либо браузер, кэширующий favicon, либо вывод сборки и CDN, всё ещё отдающие прежнюю копию из public/.
Сначала проверьте отдаваемый файл, потом кэш
Откройте /favicon.ico напрямую. Если там по-прежнему старое изображение, сборка не подхватила ваш новый файл: dev-сервер или деплой отдают устаревшую копию из public/, и очистка кэша браузера не поможет.
Если прямой URL правильный, а вкладка нет, дело в браузере. Favicon кэшируются жёстко и независимо от страницы, поэтому обычного обновления часто недостаточно.
Очищайте по порядку
- 1
Проставьте версию в ссылке или сделайте жёсткое обновление
Измените href на /favicon.ico?v=2, чтобы браузер счёл его новым файлом, затем сделайте жёсткое обновление в приватном окне.
- 2
Перезапустите dev-сервер или пересоберите
Dev-серверы часто отдают закэшированный файл из public/, пока их не перезапустишь. В продакшене пересоберите, чтобы новый файл попал в вывод.
- 3
Очистите CDN
Если перед сайтом стоит CDN, инвалидируйте путь favicon, чтобы граничные узлы перестали раздавать старые байты.
Favicon не обновляется в React: частые вопросы
Почему мой favicon в React не обновляется?
Либо сборка всё ещё отдаёт старый файл (проверьте /favicon.ico напрямую), либо браузер его закэшировал. Для первого перезапустите dev-сервер или пересоберите; для второго проставьте версию в URL и сделайте жёсткое обновление.
Как принудительно обновить favicon?
Допишите к href иконки строку версии, например /favicon.ico?v=2, затем сделайте жёсткое обновление или откройте приватное окно. Именно изменение URL заставляет браузер получить свежий файл.
В dev изменилось, а после деплоя нет.
Деплой отдаёт закэшированную копию из сборки или CDN. Убедитесь, что новый файл есть в выводе сборки, затем очистите путь на CDN и снова откройте прямой URL.