Next.js के लिए फ़ेविकॉन
Next.js 14+ ऐप राउटर /app/icon.png और /app/favicon.ico को कन्वेंशन के रूप में मानता है - उन्हें छोड़ दें और नेक्स्ट स्वचालित रूप से सही टैग उत्सर्जित करता है।
favicon.ico को /ऐप के अंदर रखें और अगला इसे /favicon.ico पर परोसेगा और लिंक टैग इंजेक्ट करेगा।
बहु-आकार या थीम वाले आइकन के लिए, फ़ाइल कन्वेंशन का उपयोग करें: /app के अंदर आइकन.पीएनजी, आइकन.एसवीजी, ऐप्पल-आइकन.पीएनजी। अगला फ़ाइल मेटाडेटा से <लिंक> टैग उत्पन्न करता है।
यह कैसे काम करता है
- 1
favicon.ico उत्पन्न करें
512×512 स्रोत से बहु-आकार 16/32/48/64।
- 2
/ऐप में रखें
/app/favicon.ico स्वतः-सेवारत है। एचडी के लिए आइकन.पीएनजी जोड़ें।
- 3
सत्यापित करें
अपने ब्राउज़र में /favicon.ico खोलें - नेक्स्ट इसे बिना किसी कॉन्फिगरेशन के पेश करता है।
अभी आज़माएं
एक Next.js-तैयार फ़ेविकॉन जेनरेट करें
फ़ेविकॉन जनरेटरसामान्य प्रश्न
Next.js ऐप राउटर में आइकन कहां जाते हैं?+
/ऐप निर्देशिका के अंदर। फ़ाइल नाम (आइकन, ऐप्पल-आइकन, फ़ेविकॉन) भूमिका निर्धारित करता है।
पेज राउटर के बारे में क्या?+
favicon.ico को /public में डालें और इसे _document.tsx से लिंक करें।
क्या मुझे अब भी बहु-आकार .ico की आवश्यकता है?+
पुराने ब्राउज़र समर्थन के लिए अनुशंसित, विशेष रूप से Edge और IE-मोड शॉर्टकट।