Clarification on Babel Polyfill Documentation

[liamfd]

Summary

The language in the 1 -> 2 migration guide around the babel-polyfill is somewhat confusing, so I'd like to get some clarification if possible!

I originally asked this in another thread (#7064 (comment)), but I think it makes more sense as a standalone question.

Relevant information

Remove explicit polyfills

If your Gatsby v1 site included any polyfills, you can remove them. Gatsby v2 ships with babel 7 and is configured to automatically include polyfills for your code. See Gatsby’s babel docs for more details.

Note: This works for your own code, but is not yet implemented for code imported from node_modules. Track progress of this feature at bullet 5 of this issue.

I'm confused by this because my understanding is that babel-polyfill makes its changes globally (as opposed to injecting things into the scope of each module). That seems to match what its docs say:

The polyfill adds to the global scope as well as native prototypes like String in order to do this.

If that's the case, what does the migration guide mean when it says that this is "not yet implemented for code imported from node_modules"? I would think that the node_modules code would have access to the polyfills if they're in the global scope.

Is the issue that, because Gatsby uses useBuiltIns: 'usage', and because out of the box Gatsby does not transpile node_modules, babel may not inject the polyfills required by those node_modules because babel never sees their code? Meaning, if some of the transpiled code did require the same polyfills, they would be available to the code from node_modules, but if not, the polyfill would never get injected.

Finally (and maybe most importantly), since React requires Map and Set, does this caveat mean that Gatsby 2 may not work out of the box for older browsers, because there's no guarantee that they would get polyfilled?

I'm happy to contribute back to the docs on this if applicable.

Environment (if relevant)

N/a

File contents (if changed)

N/a

[benjaminhoffman]

+1 . @liamfd did you find a fix for this?

for v1, this worked for me for production builds:

current.entry.app = ['babel-polyfill', current.entry.app];

[Undistraction]

@liamfd Gatsby will only polyfill code within your project. If you are using third party modules that need polyfills that have not been needed within your project code, the polyfills will be missing at runtime and cause hard-to-debug errors.

[gatsbot]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contributefor more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[gatsbot]

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it.

Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else.

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community!