Getting error when running gatsby build!

[itzsrv]

Running gatsby build throws following error:

ERROR #11328 

A page component must export a React component for it to be valid. Please make sure this file exports a React component:

undefined

not finished createPagesStatefully - 0.079s

Could be due to one of the plugins versions, tried solving locally but couldn't get it!

gatsby develop gives below errors in browser:

[ganevdev]

Not enough data to understand what went wrong. Can you create a repository where this error is reproduced?

I can assume that this is due to the fact that there is no content on the site, you need at least some content, for this there is content/links/frontmatter-placeholder in each starter.

[itzsrv]

I started with gatsby-starter-chronoblog,

gatsby new chronoblog-starter-site https://github.com/Chronoblog/gatsby-starter-chronoblog
cd chronoblog-starter-site/
gatsby build

My environment details are as below:

gatsby info

  System:
    OS: macOS 10.15.5
    CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 14.4.0 - /usr/local/bin/node
    npm: 6.14.4 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 83.0.4103.97
    Safari: 13.1.1
  npmPackages:
    gatsby: ^2.18.7 => 2.23.1
    gatsby-plugin-google-analytics: ^2.1.23 => 2.3.3
    gatsby-plugin-manifest: ^2.2.27 => 2.4.10
    gatsby-plugin-sitemap: ^2.2.21 => 2.4.4
    gatsby-theme-chronoblog: ^0.22.0 => 0.22.0
  npmGlobalPackages:
    gatsby-cli: 2.12.44

[ganevdev]

Thanks for the info!

[ederst]

Wanted to take the hacker starter for a spin, but unfortunately I got the same error. This is what the console says btw.:

The above error occurred in the <Context.Provider> component:
    in MDXProvider (at wrap-root-element.js:65)
    in MDXScopeProvider (at wrap-root-element.js:64)
    in Unknown
    in Unknown (at wrap-root-element.js:72)
    in StaticQueryStore (at root.js:138)
    in _default (at app.js:94)

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries. index.js:2177
    __stack_frame_overlay_proxy_console__ index.js:2177
    React 22
        logCapturedError
        logError
        callback
        callCallback
        commitUpdateQueue
        commitLifeCycles
        commitLayoutEffects
        callCallback
        invokeGuardedCallbackDev
        invokeGuardedCallback
        commitRootImpl
        unstable_runWithPriority
        runWithPriority$1
        commitRoot
        finishSyncRender
        performSyncWorkOnRoot
        scheduleUpdateOnFiber
        updateContainer
        legacyRenderSubtreeIntoContainer
        unbatchedUpdates
        legacyRenderSubtreeIntoContainer
        render
    js app.js:94

And this is my gatsby info:

❯ gatsby info

  System:
    OS: macOS 10.15.5 # i tried on a debian system too, but to no avail
    CPU: # not relevant
    Shell: # not relevant
  Binaries:
    Node: 12.18.0 - ~/.nodenv/versions/12.18.0/bin/node
    npm: 6.14.4 - ~/.nodenv/versions/12.18.0/bin/npm
  Languages:
    Python: 2.7.16 - /Users/stefan.prietl/.pyenv/shims/python
  Browsers:
    Chrome: 83.0.4103.97
    Firefox: 77.0.1
    Safari: 13.1.1
  npmPackages:
    gatsby: ^2.18.7 => 2.23.3
    gatsby-plugin-google-analytics: ^2.1.23 => 2.3.4
    gatsby-plugin-manifest: ^2.2.27 => 2.4.11
    gatsby-plugin-sitemap: ^2.2.21 => 2.4.5
    gatsby-theme-chronoblog: ^0.22.0 => 0.22.0
  npmGlobalPackages:
    gatsby-cli: 2.12.45

The version of mdx-js/reactI get:

│ │ │ ├── @mdx-js/react@1.6.5 deduped
│ │ │ │ └── @mdx-js/react@1.6.5 deduped
│ │ │ ├── @mdx-js/react@1.6.5 deduped
│ │ │ │ ├── @mdx-js/react@1.6.5 deduped
│ ├── @mdx-js/react@1.6.5

So I guess it has something to do with the @mdx-js/react module which got recently updated to 1.6.5, which was after the last deployment of your chronoblogs (around 2020-04-27 I think?).

I already played around trying to get an earlier mdx-js version, but I was not able to do this (I am new to this so the dependency management of npm is a bit of a blackbox to me right now).

HTH somehow.

[ederst]

It may also be worth noting that the starters are working when checking out gatsby-theme-chronoblog and running for example yarn start:hacker.

Edit:

It looks like when building the starters with yarn instead of npm it will work.

chronoblog-site on master via ⬢ v12.18.0
❯ gatsby new ...
# ...
success Created starter directory layout
info Installing packages...
✔ Which package manager would you like to use ? › yarn
info Preferred package manager set to "yarn"
yarn install v1.22.4
# ...

This results in the following for mdx-js/react:

❯ yarn list | grep mdx-js/react
├─ @mdx-js/react@1.6.5
│  ├─ @mdx-js/react@^1.6.5
│  └─ @mdx-js/react@^1.0.0
│  ├─ @mdx-js/react@^1.5.2
│  ├─ @mdx-js/react@^1.6.5
│  ├─ @mdx-js/react@^1.5.1

So a bit different from the npm install approach.

[ganevdev]

@ederst @itzsrv

I published a new version of Chronoblog - v0.23.0 (https://www.npmjs.com/package/gatsby-theme-chronoblog).

It would be great if you tested the new version. The problems listed here, I hope, have been resolved, but I'm not 100% sure.

[itzsrv]

hi @ganevru,

Its working great for me! Thanks a lot!

[ederst]

@ganevru can confirm that it's working now wit npm too; tested with git clone; npm i, and with gatsby new

thanks!

[ganevdev]

@itzsrv @ederst thank you, guys 🤝