gatsby-plugin-manifest upgrade/downgrade issue

[Isaac-Tait]

I updated my dependencies and when attempting to start a local server for my project I got this error:

Invalid plugin options for "gatsby-plugin-manifest":- "value" must contain at least one of [icon, icons]

Here is the commit that caused the issue

Following this issue report I downgraded “gatsby-plugin-manifest” to 2.4.37

Now when I run npm start I get this error:

  Referenced from: /Users/isaactait/Desktop/100_Days_of_Code/gatsby-fallfish-tenkara-blog/node_modules/sharp/build/Release/sharp.node
  Expected in: /Users/isaactait/Desktop/100_Days_of_Code/gatsby-fallfish-tenkara-blog/node_modules/gatsby-plugin-manifest/node_modules/sharp/build/Release/../../vendor/lib/libvips.42.dylib

dyld: Symbol not found: _g_once_impl
  Referenced from: /Users/isaactait/Desktop/100_Days_of_Code/gatsby-fallfish-tenkara-blog/node_modules/sharp/build/Release/sharp.node
  Expected in: /Users/isaactait/Desktop/100_Days_of_Code/gatsby-fallfish-tenkara-blog/node_modules/gatsby-plugin-manifest/node_modules/sharp/build/Release/../../vendor/lib/libvips.42.dylib

[1]    22960 killed     npm start

This issue might be related as it seems validation support is causing issues with updating plugins...?

Environment

System:
OS: macOS 11.0.1
CPU: (8) x64 Intel(R) Core(TM) i7-1068NG7 CPU @ 2.30GHz
Shell: 5.8 - /bin/zsh
Binaries:
Node: 14.9.0 - /usr/local/bin/node
Yarn: 1.22.5 - /usr/local/bin/yarn
npm: 6.14.9 - /usr/local/bin/npm
Languages:
Python: 2.7.16 - /usr/bin/python
Browsers:
Firefox: 83.0
Safari: 14.0.1
npmPackages:
gatsby: ^2.27.1 => 2.27.1
gatsby-awesome-pagination: ^0.3.6 => 0.3.6
gatsby-image: ^2.6.0 => 2.6.0
gatsby-plugin-feed: ^2.8.0 => 2.8.0
gatsby-plugin-manifest: ^2.4.37 => 2.4.37
gatsby-plugin-netlify: ^2.6.0 => 2.6.0
gatsby-plugin-offline: ^3.5.0 => 3.5.0
gatsby-plugin-postcss: ^2.3.13 => 2.3.13
gatsby-plugin-react-helmet: ^3.5.0 => 3.5.0
gatsby-plugin-sharp: ^2.9.0 => 2.9.0
gatsby-plugin-typography: ^2.7.0 => 2.7.0
gatsby-remark-copy-linked-files: ^2.5.0 => 2.5.0
gatsby-remark-images: ^3.6.0 => 3.6.0
gatsby-remark-prismjs: ^3.8.0 => 3.8.0
gatsby-remark-responsive-iframe: ^2.6.0 => 2.6.0
gatsby-remark-smartypants: ^2.5.0 => 2.5.0
gatsby-source-filesystem: ^2.6.1 => 2.6.1
gatsby-transformer-remark: ^2.11.0 => 2.11.0
gatsby-transformer-sharp: ^2.7.0 => 2.7.0
npmGlobalPackages:
gatsby-cli: 2.12.111

[huynhpeter]

Just ran into this issue as well.

[LekoArts]

Thank you for opening this!

You're rightfully getting an error when upgrading your plugin as your configuration for it is invalid. You commented out the icon (https://github.com/Isaac-Tait/Fallfish-Tenkara/blob/master/gatsby-config.js#L166) but it is required for the plugin to work.

The second error is occurring because with the downgrade of only that plugin you have different versions of sharp installed that cause that mismatch.

To resolve your problems you should upgrade to the latest version and uncomment the icon to have a valid configuration.

We're marking this issue as answered and closing it for now but please feel free to comment here if you would like to continue this discussion. We also recommend heading over to our communities if you have questions that are not bug reports or feature requests. We hope we managed to help and thank you for using Gatsby!

[Isaac-Tait]

Thank you very much @LekoArts this solved my issue.

[ShawnOakley]

I'm getting this error and my config file has the icon values set:

{
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: "Shawn Oakley - NYC-based Fullstack Web Developer and UX Designer",
        short_name: "Shawn Oakley",
        start_url: "/",
        background_color: "#88FFFF",
        theme_color: "#88FFFF",
        // Enables "Add to Homescreen" prompt and disables browser UI (including back button)
        // see https://developers.google.com/web/fundamentals/web-app-manifest/#display
        display: "standalone",
        // Not working
        icon: `src/images/my-icon.png`, // This path is relative to the root of the site.
        icons: [
          {
            src: `src/images/my-icon.png`,
            sizes: `48x48`,
            type: `image/png`,
          },
          {
            src: `src/images/my-icon.png`,
            sizes: `72x72`,
            type: `image/png`,
          },
        ],
        // An optional attribute which provides support for CORS check.
        // If you do not provide a crossOrigin option, it will skip CORS for manifest.
        // Any invalid keyword or empty string defaults to `anonymous`
        crossOrigin: `use-credentials`,
      },
    },