Build error with gatsby

[AienTech]

Hey there,

We currently have a setup with Gatsby and Storybook. The storybook config is as follows:

module.exports = {
  stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
  addons: [
    "@storybook/addon-a11y",
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@storybook/addon-actions",
    "storybook-addon-gatsby",
    "storybook-addon-apollo-client",
    {
      name: "@storybook/addon-postcss",
      options: {
        cssLoaderOptions: {
          // When you have splitted your css over multiple files
          // and use @import('./other-styles.css')
          importLoaders: 1,
        },
        postcssLoaderOptions: {
          // When using postCSS 8
          implementation: require("postcss"),
        },
      },
    },
  ],
  framework: "@storybook/react",
  core: {
    builder: "webpack5",
  },
  webpackFinal: async (config) => {
    // Transpile Gatsby module because Gatsby includes un-transpiled ES6 code.
    config.module.rules[0].exclude = [/node_modules\/(?!(gatsby)\/)/];
    config.module.rules[0].exclude = [/core-js/];
    config.resolve.mainFields = ["browser", "module", "main"];
    return config;
  },
};

Unfortunately when running the command build-storybook -o public/storybook/ we face the following issue:

$ build-storybook -o public/storybook/
info @storybook/react v6.5.9
info 
info => Cleaning outputDir: /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/public/storybook/
info => Loading presets
info Found existing addon "@storybook/addon-actions", skipping.
info => Loading custom manager config
info => Compiling manager..
info => Compiling preview..
info => Loading custom manager config
info Addon-docs: using MDX1
info => Using PostCSS preset with [email protected]
info => Using default Webpack5 setup
17% building 2/16 entries 7599/7700 dependencies 668/1927 modules[BABEL] Note: The code generator has deoptimised the styling of /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/axe-core/axe.js as it exceeds the max of 500KB.
17% building 2/16 entries 7700/8131 dependencies 672/1928 modulesinfo => Manager built (43 s)
18% building 2/16 entries 8900/9039 dependencies 761/2020 modules[BABEL] Note: The code generator has deoptimised the styling of /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/lottie-web/build/player/lottie.js as it exceeds the max of 500KB.
ERR! => Failed to build the preview
ERR! Module not found: Error: Can't resolve '@gatsbyjs/reach-router/lib/utils' in '/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/dist'
ERR! Did you mean 'utils.js'?
ERR! BREAKING CHANGE: The request '@gatsbyjs/reach-router/lib/utils' failed to resolve only because it was resolved as fully specified
ERR! (probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
ERR! The extension in the request is mandatory for it to be fully specified.
ERR! Add the extension to the request.
64% building 16/16 entries 12325/12377 dependencies 2052/2294 modulesERR! ModuleNotFoundError: Module not found: Error: Can't resolve '@gatsbyjs/reach-router/lib/utils' in '/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/dist'
ERR! Did you mean 'utils.js'?
ERR! BREAKING CHANGE: The request '@gatsbyjs/reach-router/lib/utils' failed to resolve only because it was resolved as fully specified
ERR! (probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
ERR! The extension in the request is mandatory for it to be fully specified.
ERR! Add the extension to the request.
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/Compilation.js:2016:28
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:798:13
ERR!     at eval (eval at create (/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:10:1)
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:270:22
ERR!     at eval (eval at create (/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:434:22
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:116:11
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:670:25
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:855:8
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:975:5
ERR!  ModuleNotFoundError: Module not found: Error: Can't resolve '@gatsbyjs/reach-router/lib/utils' in '/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/dist'
ERR! Did you mean 'utils.js'?
ERR! BREAKING CHANGE: The request '@gatsbyjs/reach-router/lib/utils' failed to resolve only because it was resolved as fully specified
ERR! (probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
ERR! The extension in the request is mandatory for it to be fully specified.
ERR! Add the extension to the request.
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/Compilation.js:2016:28
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:798:13
ERR!     at eval (eval at create (/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:10:1)
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:270:22
ERR!     at eval (eval at create (/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:434:22
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:116:11
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:670:25
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:855:8
ERR!     at /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/webpack/lib/NormalModuleFactory.js:975:5
ERR! resolve '@gatsbyjs/reach-router/lib/utils' in '/Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/dist'
ERR!   Parsed request is a module
ERR!   using description file: /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/package.json (relative path: ./dist)
ERR!     Field 'browser' doesn't contain a valid alias configuration
ERR!     resolve as module
ERR!       /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/dist/node_modules doesn't exist or is not a directory
ERR!       looking for modules in /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/node_modules
ERR!         /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/gatsby-link/node_modules/@gatsbyjs/reach-router doesn't exist
ERR!       /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/node_modules doesn't exist or is not a directory
ERR!       looking for modules in /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules
ERR!         existing directory /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/@gatsbyjs/reach-router
ERR!           using description file: /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/@gatsbyjs/reach-router/package.json (relative path: .)
ERR!             using description file: /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/@gatsbyjs/reach-router/package.json (relative path: ./lib/utils)
ERR!               Field 'browser' doesn't contain a valid alias configuration
ERR!               /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/frontend-v2/node_modules/@gatsbyjs/reach-router/lib/utils doesn't exist
ERR!       /Users/aiensaidi/WeAreGroup/Projects/yes/open-banking/node_modules doesn't exist or is not a directory
ERR!       /Users/aiensaidi/WeAreGroup/Projects/yes/node_modules doesn't exist or is not a directory
ERR!       /Users/aiensaidi/WeAreGroup/Projects/node_modules doesn't exist or is not a directory
ERR!       /Users/aiensaidi/WeAreGroup/node_modules doesn't exist or is not a directory
ERR!       /Users/aiensaidi/node_modules doesn't exist or is not a directory
ERR!       /Users/node_modules doesn't exist or is not a directory
ERR!       /node_modules doesn't exist or is not a directory
info => Loading presets
info Found existing addon "@storybook/addon-actions", skipping.

attention => Storybook now collects completely anonymous telemetry regarding usage.
This information is used to shape Storybook's roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://storybook.js.org/telemetry

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

do I have to provide more context?