gatsby: Plugin options error for `gatsby-plugin-manifest` and `gatsby-remark-images`

Description

Two weeks ago I updated my dependencies: https://github.com/FNSKtZH/ae2/commit/1aa2fa097f96c4579e8ee48e5c8bcc55e56c3a7a

That is when yarn dev stopped working with this error:

alexa@PCA C:\Users\alexa\ae2
$ yarn dev
yarn run v1.22.5
$ gatsby develop
success open and validate gatsby-configs - 0.075s
error Invalid plugin options for "gatsby-plugin-manifest":

- "scope" is not allowed
error Invalid plugin options for "gatsby-remark-images":

- "wrapperStyle" must be one of [object]
not finished load plugins - 5.593s
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I checked gatsby-plugin-manifest and found absolutely no mention of scope not being allowed. I also checked gatsby-remark-images and found nothing to be wrong with wrapperStyle.

As all had worked fine before the update, I decided to roll it back.

But now I am facing this error:

$ gatsby develop
success open and validate gatsby-configs - 0.071s
success load plugins - 5.936s
success onPreInit - 0.046s
success initialize cache - 0.008s
success copy gatsby files - 0.459s
success onPreBootstrap - 0.064s
success createSchemaCustomization - 0.118s
success Checking for changed pages - 0.004s
success source and transform nodes - 0.470s
success building schema - 0.377s
info Total nodes: 126, SitePage nodes: 6 (use --verbose for breakdown)
success createPages - 0.052s
success Checking for changed pages - 0.002s
success createPagesStatefully - 0.161s
success update schema - 0.018s
success write out redirect data - 0.002s
success Build manifest and related icons - 0.098s
success onPostBootstrap - 0.109s
info bootstrap finished - 16.776s
success onPreExtractQueries - 0.002s
success extract queries from components - 3.344s
success write out requires - 0.079s
success run page queries - 1.160s - 20/20 17.23/s

 ERROR #98124  WEBPACK

Generating SSR bundle failed

Can't resolve 'react-dom' in 'C:\Users\alexa\ae2\node_modules\gatsby-react-router-scroll'

If you're trying to use a package make sure that 'react-dom' is installed. If you're trying to use a local file make sure that the path is correct.

File: node_modules\gatsby-react-router-scroll\scroll-container.js

not finished Generating image thumbnails - 13.432s
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Today (two weeks later) I tried updating to the newest gatsby libs. Hoping the issue had been solved in the meantime. But that only provokes the first issue again.

What I have tried during two full work days several times:

  • reverting to the dependencies before updating
  • reverting again to the dependencies after updating
  • updating to newer dependencies (tow weeks later i.e. today)
  • deleting yarn.lock, removing node_modules folder, running gatsby clean in all above cases
  • searched the gatsby issues and the www for solutions. Many. None worked so far

So meanwhile I am completely out of options. I have no idea how to get this project running again.

Of course this project has grown over years and it is much too complicated to create a simple reproducible case. So I guess I am stuck for good.

I fear that if no one finds a bug in gatsby that solves this problem, my only way out will be to rebuild this huge project with a different tool, like next.js. Which makes me cry.

Environment

Run gatsby info --clipboard in your project directory and paste the output here.

alexa@PCA C:\Users\alexa\ae2                                                                          
$ yarn gatsby info --clipboard                                                                        
yarn run v1.22.5                                                                                      
$ C:\Users\alexa\ae2\node_modules\.bin\gatsby info --clipboard                                        
                                                                                                      
  System:                                                                                             
    OS: Windows 10 10.0.19041                                                                         
    CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz                                            
  Binaries:                                                                                           
    Node: 15.0.1 - ~\AppData\Local\Temp\yarn--1604515285930-0.8068366765720616\node.CMD               
    Yarn: 1.22.5 - ~\AppData\Local\Temp\yarn--1604515285930-0.8068366765720616\yarn.CMD               
    npm: 7.0.3 - C:\Program Files\nodejs\npm.CMD                                                      
  Languages:                                                                                          
    Python: 2.7.17                                                                                    
  Browsers:                                                                                           
    Chrome: 86.0.4240.111                                                                             
    Edge: Spartan (44.19041.423.0), Chromium (86.0.622.61)                                            
  npmPackages:                                                                                        
    gatsby: 2.24.80 => 2.24.80                                                                        
    gatsby-cli: 2.12.109 => 2.12.109                                                                  
    gatsby-plugin-create-client-paths: 2.3.13 => 2.3.13                                               
    gatsby-plugin-eslint: 2.0.8 => 2.0.8                                                              
    gatsby-plugin-manifest: 2.4.35 => 2.4.35                                                          
    gatsby-plugin-offline: 3.2.33 => 3.2.33                                                           
    gatsby-plugin-react-helmet: 3.3.14 => 3.3.14                                                      
    gatsby-plugin-sharp: 2.6.42 => 2.6.42                                                             
    gatsby-plugin-styled-components: 3.3.14 => 3.3.14                                                 
    gatsby-plugin-typography: 2.5.13 => 2.5.13                                                        
    gatsby-remark-autolink-headers: 2.3.15 => 2.3.15                                                  
    gatsby-remark-copy-linked-files: 2.3.19 => 2.3.19                                                 
    gatsby-remark-emojis: 0.4.3 => 0.4.3                                                              
    gatsby-remark-external-links: 0.0.4 => 0.0.4                                                      
    gatsby-remark-images: 3.3.35 => 3.3.35                                                            
    gatsby-remark-images-medium-zoom: 1.7.0 => 1.7.0                                                  
    gatsby-source-filesystem: 2.3.35 => 2.3.35                                                        
    gatsby-transformer-remark: 2.8.42 => 2.8.42                                                       
    gatsby-transformer-sharp: 2.5.18 => 2.5.18                                                        

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 18 (5 by maintainers)

Most upvoted comments

Today I updated to:

{
  "gatsby-plugin-manifest": "2.6.1",
  "gatsby-remark-images": "3.5.1"
}

and scope as well as wrapperStyle are not causing the build to break any more.

Thanks to all involved!

ERROR

There was a problem loading plugin “gatsby-plugin-manifest”. Perhaps you need to install its package? Use --verbose to see actual error. ERROR Failed to resolve gatsby-plugin-manifest unreachable Error: unreachable

Solution: I just updated my node and ran again npm install gatsby. This Worked for me…

O.k., I finally managed to solve this error:

ERROR #98124  WEBPACK

Generating SSR bundle failed

Can't resolve 'react-dom' in 'C:\Users\alexa\ae2\node_modules\gatsby-react-router-scroll'

I went through all my dependencies. There are many 🙄. And cleaned up. Then I stumbled over a dependency that needed some webpack rules to be altered. While looking at the gatsby-node.js file, I spotted another webpack config entry:

if (stage.startsWith('develop')) {
    actions.setWebpackConfig({
      resolve: {
        alias: {
          'react-dom': '@hot-loader/react-dom',
        },
      },
    })
  }

Luckily I had commented why it had been added: https://github.com/gatsbyjs/gatsby/issues/11934#issuecomment-646966955. So basically it was to patch hot reloading issues. But I forgot to install @hot-loader/react-dom.

After adding @hot-loader/react-dom to the dev dependencies, yarn dev worked again!

To be honest I have absolutely no idea why the missing of @hot-loader/react-dom had no influence for so long (but for hot reloading always seeming to not quite work as expected) and then suddenly - BAM. Maybe some of the other changes had some influence too.

Thanks @LekoArts for your great pointer!

@mxstbr

Thanks for caring!

Where did you find it/what do you think it does?

https://developer.mozilla.org/en-US/docs/Web/Manifest/scope also: https://web.dev/add-manifest/#manifest-properties

I’ve opened #27912 to fix this

Thanks!