React Uygulamalarında Favicon Yapılandırması

Tek sayfalık React uygulamalarında statik marka öğelerini yapılandırın. Genel klasörleri nasıl eşleştireceğinizi öğrenin.

React'te Favicon Dosyaları Nereye Konulmalıdır?

Vite, Create React App veya Next.js kullanıyor olmanızdan bağımsız olarak, faviconlar gibi tüm statik dosyalar projenizin kök dizinindeki public/ dizinine ait olmalıdır.

  1. Dosyaları ZIP olarak almak için ana sayfa oluşturucumuzu kullanarak PNG'nizi dönüştürün.
  2. Tüm dosyaları doğrudan React projenizin kök dizinindeki public/ klasörüne çıkarın.
  3. index.html dosyasını açın (Vite için proje kök dizininde veya Create React App için public/ içinde bulunur).
  4. Genel dizine göre göreceli URL'leri gösteren standart HTML başlık meta etiketlerini ekleyin veya değiştirin:
<link rel="icon" type="image/x-icon" href="/favicon.ico"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">