Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Handle undefined webpack build error #2360

Merged
merged 1 commit into from
Oct 16, 2017
Merged

Conversation

iv-mexx
Copy link
Contributor

@iv-mexx iv-mexx commented Oct 6, 2017

I ran into this problem when gatsby build failed with

TypeError: Cannot read property 'chunk' of undefined

/Users///node_modules/gatsby/node_modules/webpack/lib/Stats.js:93
if(e.chunk) {
^

TypeError: Cannot read property 'chunk' of undefined
at formatError (/Users///node_modules/gatsby/node_modules/webpack/lib/Stats.js:93:7)
at Array.map ()
at Stats.toJson (/Users///node_modules/gatsby/node_modules/webpack/lib/Stats.js:123:30)
at /Users///node_modules/gatsby/dist/utils/build-html.js:70:45
at Compiler. (/Users///node_modules/gatsby/node_modules/webpack/lib/Compiler.js:194:14)
at Compiler.emitRecords (/Users///node_modules/gatsby/node_modules/webpack/lib/Compiler.js:282:37)
at Compiler. (/Users///node_modules/gatsby/node_modules/webpack/lib/Compiler.js:187:11)
at /Users///node_modules/gatsby/node_modules/webpack/lib/Compiler.js:275:11
at Compiler.applyPluginsAsync (/Users///node_modules/gatsby/node_modules/tapable/lib/Tapable.js:60:69)
at Compiler.afterEmit (/Users///node_modules/gatsby/node_modules/webpack/lib/Compiler.js:272:8)
at Compiler. (/Users///node_modules/gatsby/node_modules/webpack/lib/Compiler.js:267:14)
at /Users///node_modules/gatsby/node_modules/webpack/node_modules/async/lib/async.js:52:16
at done (/Users///node_modules/gatsby/node_modules/webpack/node_modules/async/lib/async.js:246:17)
at /Users///node_modules/gatsby/node_modules/webpack/node_modules/async/lib/async.js:44:16
at /Users///node_modules/graceful-fs/graceful-fs.js:43:10
at FSReqWrap.oncomplete (fs.js:136:15)

After some digging around I found that this was not the actual build error!

For some reason, stats.compilation.errors contained an undefined at first place:

stats.compilation.errors
errors:
      [ undefined,
        'FirebaseError: Firebase: Firebase App named '[DEFAULT]' already exists (app/duplicate-app).
            at error (render-page.js:52589:22)
            at Object.initializeApp (render-page.js:52488:14)
            at new Ginfo (render-page.js:52021:19)
            at Object.createStore [as default] (render-page.js:51969:16)
            at Template (render-page.js:48337:39)
            at ReactCompositeComponentWrapper._constructComponentWithoutOwner (render-page.js:14596:15)
            at ReactCompositeComponentWrapper._constructComponent (render-page.js:14572:20)
            at ReactCompositeComponentWrapper.mountComponent (render-page.js:14475:22)
            at Object.mountComponent (render-page.js:7457:36)
            at ReactCompositeComponentWrapper.performInitialMount (render-page.js:14658:35)',
        'FirebaseError: Firebase: Firebase App named '[DEFAULT]' already exists (app/duplicate-app).
            at error (render-page.js:52589:22)
            at Object.initializeApp (render-page.js:52488:14)
            at new Ginfo (render-page.js:52021:19)
            at Object.createStore [as default] (render-page.js:51969:16)
            at Template (render-page.js:48337:39)
            at ReactCompositeComponentWrapper._constructComponentWithoutOwner (render-page.js:14596:15)
            at ReactCompositeComponentWrapper._constructComponent (render-page.js:14572:20)
            at ReactCompositeComponentWrapper.mountComponent (render-page.js:14475:22)
            at Object.mountComponent (render-page.js:7457:36)
            at ReactCompositeComponentWrapper.performInitialMount (render-page.js:14658:35)',
        'FirebaseError: Firebase: Firebase App named '[DEFAULT]' already exists (app/duplicate-app).
            at error (render-page.js:52589:22)
            at Object.initializeApp (render-page.js:52488:14)
            at new Ginfo (render-page.js:52021:19)
            at Object.createStore [as default] (render-page.js:51969:16)
            at Template (render-page.js:48337:39)
            at ReactCompositeComponentWrapper._constructComponentWithoutOwner (render-page.js:14596:15)
            at ReactCompositeComponentWrapper._constructComponent (render-page.js:14572:20)
            at ReactCompositeComponentWrapper.mountComponent (render-page.js:14475:22)
            at Object.mountComponent (render-page.js:7457:36)
            at ReactCompositeComponentWrapper.performInitialMount (render-page.js:14658:35)',
        'FirebaseError: Firebase: Firebase App named '[DEFAULT]' already exists (app/duplicate-app).
            at error (render-page.js:52589:22)
            at Object.initializeApp (render-page.js:52488:14)
            at new Ginfo (render-page.js:52021:19)
            at Object.createStore [as default] (render-page.js:51969:16)
            at Template (render-page.js:48337:39)
            at ReactCompositeComponentWrapper._constructComponentWithoutOwner (render-page.js:14596:15)
            at ReactCompositeComponentWrapper._constructComponent (render-page.js:14572:20)
            at ReactCompositeComponentWrapper.mountComponent (render-page.js:14475:22)
            at Object.mountComponent (render-page.js:7457:36)
            at ReactCompositeComponentWrapper.performInitialMount (render-page.js:14658:35)' ],

(Not sure where this undefined is coming from and it might still bite my ass when I fix the other errors later).

This undefined caused the TypeError: Cannot read property 'chunk' of undefined error when calling stats.toJson and because of that, my actual errors were swallowed, leaving me scratching my head.

This proposed change filters out undefined from stats.compilation.errors before handing the first error to the rejection.
I'm not sure why toJson() is/was necessary at all since it works right now without.

@KyleAMathews
Copy link
Contributor

Huh, seems right @jquense, look good? I'm not super familiar with this stuff.

Here's a good breakdown of the differences https://stackoverflow.com/questions/40201468/what-constitutes-a-build-error-vs-stats-compilation-errors-or-stats-compilation

Looks like we should print both of them out if they exist?

@KyleAMathews
Copy link
Contributor

@iv-mexx could you modify your PR to print out both errors?

@iv-mexx
Copy link
Contributor Author

iv-mexx commented Oct 13, 2017

@KyleAMathews I'm not sure what you mean with "both errors".

If I understand correctly, the Stackoverflow question you linked talks about the difference between the error returned from webpack in the callback and the error contained in stats.

The first one is already handled in the lines above my change (Line 29).
The second kind is what I've changed, but the stats structure itself does not seem to contain any other errors.

If you're talking about the fact, that only errors[0] is returned, that was the same before. I would change it to return all errors in the array, but I could not figure out how to return multiple errors in the rejection - any hints on that?

@jquense
Copy link
Contributor

jquense commented Oct 13, 2017

Using the stats object is the recommended approach by webpack, why not continue to use it but filter out undefined errors in the array?

@iv-mexx
Copy link
Contributor Author

iv-mexx commented Oct 16, 2017

@jquense Thats what this PR is doing

In some cases, `stats.compilation.errors` contains an `undefined`. In these cases, `toJson` crashes when accessing a method on this undefined object. 
This change now filters out `undefined` errors
@KyleAMathews
Copy link
Contributor

KyleAMathews commented Oct 16, 2017

@gatsbybot
Copy link
Collaborator

Deploy preview ready!

Built with commit 2b224fe

https://deploy-preview-2360--gatsbygram.netlify.com

@KyleAMathews
Copy link
Contributor

Well let's give this a go then :-)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
4 participants