无法在 Meteor 中加载 Favicon

Question

我无法在选项卡中的网站名称旁边添加网站图标。我检查了三个 SO 帖子并尝试了所有可能的组合。我的 logo.ico 或 logo.png 文件位于“ProjectName/public”文件夹中。从这个文件夹我可以访问在浏览器上加载的其他图像，如果我 link 它们像这样：

<body>
  {{> carouselTemplate}}
</body>

<template name="carouselTemplate">
  <div class="container">
    <div class="row">
      <div class="col-sm-12">

        <div id="my-slider" class="carousel slide" data-ride="carousel">
          <!-- indicators dot nav -->

          <!-- wrapper for slides -->
          <div class="carousel-inner" role="listbox">
            <!-- for each slide one div [active is the first slide that is shown on the page] -->
            <div class="item active">


              <!-- #HERE -->
              <img src="/handsbwG.jpeg" alt="hands"/>
              <!-- /HERE -->


              <div class="carousel-caption">
                <h1>TEXT</h1>
              </div>
            </div>
          </div>

          <!-- controls or next and prev buttons -->

        </div>

      </div>
    </div>
  </div>
</template>

当我转到 localhost:3000/logo.ico 时会显示图标（localhost:3000/logo.png）。

不同的 SO 引用：

Ref 1
Ref 2
Ref 3

我的两个代码示例：

<link rel="icon" type="image/png" sizes="16x16 32x32" href="/logo.png">

<link rel="icon" sizes="16x16 32x32" href="/logo.ico?v=2">

Answer 1

文件必须命名为 favicon.ico ，别无其他。将 logo.ico 重命名为 favicon.ico，它应该可以工作。

header 链接可能会指向一个不同名称的文件，但我怀疑您没有将它们放在正确的位置（流星可能很难知道什么真正会被用作 header).

Answer 2

Meteor looks for all head tags and combines them to one that is sent to the client. 这就是我添加项目的方式，

client/.../partials/head.html

没有模板标签或其他任何东西，可能只是额外的头部元素。

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/img/favicon.png"/>
</head>

当然还有 public/img/

中的图标

Answer 3

我尝试了很多场景并检查了所有与此相关的答案，但这对我不起作用，所以之后我使用下面的 JavaScript 代码解决了这个问题。

此代码正在动态更改网站图标图标。

(function() {
    var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
    link.type = 'image/x-icon';
    link.rel = 'shortcut icon';
    link.href = 'http://www.whosebug.com/favicon.ico';
    document.getElementsByTagName('head')[0].appendChild(link);
})()

无法在 Meteor 中加载 Favicon

Can't load Favicon in Meteor

javascript

html

meteor

favicon