简介
Favicon 是网站的图标，通常显示在浏览器的标签栏、书签栏、收藏夹等位置，具有标识网站的作用。本文将介绍在 Next.js 中添加 Favicon 的方法。
添加 Favicon 的步骤
1. 生成 Favicon
在添加 Favicon 前，我们需要先生成一个 Favicon 图标。推荐使用 Favicon Generator 生成工具，该工具可以快速为你生成多种尺寸和格式的 Favicon 图标。
2. 将 Favicon 添加到 public 目录
将生成好的 Favicon 图标放到项目的 public 目录下，命名为 favicon.ico。
3. 在页面中引用 Favicon
在 Next.js 中，可以通过在 _document.js 中引用 Favicon，该文件位于 pages 目录下。如果该文件不存在，则需要手动创建它。
-- -------------------- ---- -------
-- ------------------
------ --------- - ----- ----- ---------- - ---- ---------------
----- ---------- ------- -------- -
-------- -
------ -
----- ----------
------
----- ------------- ----- ------------------- --
-------
------
----- --
----------- --
-------
-------
-
-
-
------ ------- ----------上述代码通过在页面头部加入 link 标签来引用 Favicon。
总结
本文介绍了在 Next.js 中添加 Favicon 的方法，通过生成 Favicon、将其放入 public 目录、在 _document.js 中引用 Favicon 这三个步骤实现了 Favicon 的添加。同时，本文还介绍了如何手动创建 _document.js 文件。希望本文对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64577456968c7c53b0a26da2