如何更改 Angular 2 应用程序中的默认网站图标？

Question

• 操作系统：win32 x64
• angular-cli: 1.0.0-beta.22-1
• 节点：7.1.0

重现步骤。

• 删除线

  <link rel="icon" type="image/x-icon" href="favicon.ico"> 
  

  来自 index.html

• ng 构建
• ng 服务
• 浏览http://localhost:4200/

它仍然显示默认的角度图标。 在清除浏览器缓存后也尝试了上述步骤，仍然是同样的问题。

以下浏览器用于重现问题：

• Chrome（版本 54.0.2840.99 m）
• IE（版本 11.0.98600.18499）

Answer 1

将您的图标文件放入 /public 或 /src/assets 文件夹。这将使您的图标对浏览器可见。见the branch on Github.

Answer 2

对于 Angular 9

1. 我在 /src 中创建了一个 favicon.png 文件并将图像放入文件中

2. 在 angular.json 中将文件添加到 assets

"assets": [
              "src/favicon.png"
          ]

1. 在 index.html 中使用这个脚本

 <link rel="icon" type="image/x-icon" href="favicon.png">

4. 如果您使用的是 Chrome，您可能需要清除缓存。

    for Windows: CTRL F5 
    for Mac: CMD SHIFT R