gatsby: gatsby build error #11328 A page component must export a React component for it to be valid. Please make sure this file exports a React component: /Users/tiagosanchez/Documents/Projects/personalBlog/node_modules/gatsby-plugin-offline/app-shell.js

Description

I run gatsby build on CLI for my blog (I am using gatsby-theme-blog and you can find it in the following link, the repo for my blog.

This was done following your tutorial link to prepare your site to be publish. The fist time I did it, it did run well, however after running the audit with Lighthouse and going through adding manifest and all the other good stuff, it is not working.

I have the following error on my console

ERROR #11328

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

/Users/tiagosanchez/Documents/Projects/personalBlog/node_modules/gatsby-plugin-offline/app-shell.js

If I go a couple of commits back (cf09d3e986c4b01efc0941d5192c7fd47d4be24e) to this one I am able to run gatsby build.

After further testing I notice that gatsby-plugin-offlineis the cause of the issue, not sure why that is the case.

Could you please point me in the right direction?

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 13
  • Comments: 24 (12 by maintainers)

Most upvoted comments

It seems that this error only started in the latest release, so you can install an older release to get your build working until this stops being an issue.

Quick Fix Instructions

  1. In package.json, change the line "gatsby-plugin-offline": "^2.2.10" to "gatsby-plugin-offline": "2.2.9"
  2. Run npm install to update the package
  3. Run gatsby build

Running npm upgrade fixed it for me, too. Thanks @davidbailey00!

I had this issue and it was due to use of a file, pages/components.js, that didn’t export a default. I modified it to export a dummy component and it resolved the issue.

Really weird, I’ve checked this out and only experiencing that issue when I attempt to deploy to Now, but not locally. Might be something to do with Node.js versions

Hi @davidbailey00, thank you for jumping in. So the gatsby-info returns the following

 System:
    OS: macOS 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.15.1 - /usr/local/bin/node
    npm: 6.4.1 - /usr/local/bin/npm
  Languages:
    Python: 2.7.10 - /Library/Frameworks/Python.framework/Versions/2.7/bin/python
  Browsers:
    Chrome: 76.0.3809.132
    Firefox: 66.0.1
    Safari: 12.1.2
  npmPackages:
    gatsby: ^2.13.67 => 2.13.67
    gatsby-plugin-manifest: ^2.2.9 => 2.2.9
    gatsby-plugin-offline: ^2.2.9 => 2.2.10
    gatsby-theme-blog: ^1.0.2 => 1.0.2
  npmGlobalPackages:
    gatsby-cli: 2.7.30

After upgrading npm I am go to go, and it did work. So, to your point it is a version mismatch

Thank you!

I think if you run npm upgrade --latest it should fix this error - seems to be caused by a version mismatch of some kind. Could you try this and confirm? If not, would love to see your gatsby info output!