如何添加favicon gatsby-config.js? [英] How do i add favicon gatsby-config.js?

查看:122
本文介绍了如何添加favicon gatsby-config.js?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

因此,我尝试在下面的代码中添加favicon到我的博客中: 在我的gatsby-config.js

so i try to add favicon in my blog the code following bellow: in my gatsby-config.js

module.exports = {
  siteMetadata: {
    title: 'Chatbiz Blog',
  },
  plugins: [
    'gatsby-plugin-react-helmet',
    'gatsby-plugin-catch-links',
    {
      resolve: 'gatsby-source-filesystem',
      options: {
        path: `${__dirname}/src/pages`,
        name: 'pages',
        icon: `https://blablabla/favicon.ico`
      },
    },
    'gatsby-transformer-remark',
  ],
}

所以问题是,当我尝试使用此代码时,收藏夹图标无法在我的博客中呈现 该怎么解决?

so the question is when i try to this code the favicon can't render in my blog how to solve the problem?

推荐答案

我相信您将图标参数放在错误的软件包选项中.

I believe, you are putting the icon params in wrong package options.

要解决此问题,请先使用以下命令安装gatsby清单插件:

To solve this, first install the gatsby manifest plugin using the command below:

npm install --save gatsby-plugin-manifest

然后将其添加到您的gatsby-config.js:

Then add this to your gatsby-config.js:

{
  resolve: `gatsby-plugin-manifest`,
  options: {
    name: `gatsby-starter-default`,
    short_name: `starter`,
    start_url: `/`,
    background_color: `#663399`,
    theme_color: `#663399`,
    display: `minimal-ui`,
    icon: `src/images/favicon.png`, // This path is relative to the root of the site.
  },

请记住停止并启动您的开发服务器,以查看您的更改.

Remember to stop and start your development server in order to see your changes.

这篇关于如何添加favicon gatsby-config.js?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆