网站建设 锐颖科技江苏省建设主管部门网站
要删除 React 项目的默认图标，使在浏览器中不显示默认图标favicon.ico，其实有两种方法：
方法一
方法要点：删除掉 public 目录下的 favicon.ico 文件，再用浏览器访问时，如果加载不到图标文件，就会不显示默认的react图标
删除 public 目录中的 favicon.ico 文件
React 项目的默认图标（favicon）是通过 public 目录下的 favicon.ico 文件来引用的。
- 路径：
public/favicon.ico
直接删除这个文件即可。
方法二
方法要点： 把favicon改成一个不存在的文件，再用浏览器访问时，就会加载不到，就会不显示默认的react图标
修改 public/index.html 中的 favicon 引用
打开 public/index.html，查找类似以下的代码：
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
修改成一个不存在的文件：
<link rel="icon" href="%PUBLIC_URL%/favicon.ico222" />
但此时通常你再访问浏览器，还会看到之前的默认图标。。此时，需要你清除浏览器缓存
如何清除浏览器缓存
删除图标后，浏览器可能仍然缓存了旧的 favicon 图标。你可以通过以下方法来强制浏览器刷新 favicon：
- 清除浏览器缓存。
- 在开发模式下，按
Ctrl + F5强制刷新页面。 - 使用隐私模式启动浏览器。
接下来，去访问chrome，竟然还是之前的图标，此时，不是因为public下的其它图标文件（logo192.png，logo512.png），也不是因为public/manifest.json里的icons配置，也不是因为src/logo.svg。而是因为chrome浏览器的本地缓存文件。
Chrome的本地缓存文件有哪些要删除
需要到对应的目录下删除一些文件：
C:\Users\xx\AppData\Local\Google\Chrome\User Data\Default
下面有两个相关的文件：
Favicons-journal
Favicons
我这里，再次访问，竟然还是之前的图标。。又查了一下，发现，只要把下面这两个目录下面的Favicons-journal和Favicons删掉，就可以了。
C:\Users\xx\AppData\Local\Google\Chrome\User Data\Default
C:\Users\xx\AppData\Local\Google\Chrome\User Data\Profile 1
C:\Users\xx\AppData\Local\Google\Chrome\User Data\Profile 2
之后，再访问就不会显示默认图标favicon.ico了
补充说明
此时，请求不存在的favicon.ico222时，竟然还返回200了。这个是由于查找不到这个文件，已经改为请求/了，这样，就相当于请求了localhost的html，所以，它的文件类型也变成了txt/html。
其实，还有其它方法可以去除默认图标的显示，不要删除图标文件的。
方法三
方法要点：修改index.html中的图标链接，而不需要删除图标文件的。
去除favicon.ico，可以如下修改index.html中的图标链接：
<link rel="icon" href="data:;">
或者这样
<link rel="icon" href="javascript:;">
补充说明
删除掉 public/index.html 中的 favicon 引用时的图标表现
删除掉 public/index.html 中的 favicon 引用时，但 public 目录下仍然保留 favicon.ico 文件，这时候，使用chrome浏览器仍然可以加载到默认图标favicon.ico。估计这是react项目的一个默认设定，当配置favicon时，使用默认图标。
删除或注释掉这一行：
<!-- <link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> -->
参考资料：
https://www.jianshu.com/p/b8337a13f152
https://www.cnblogs.com/LoveJenny/archive/2012/05/22/2512683.html
https://blog.csdn.net/qq_42813491/article/details/104004541