Place custom polyfills in polyfills.js instead of main.js?

[Tylerian]

According to the official examples, it is best practice to add your custom polyfills to Webpack's main.js entry point instead of polyfills.js... Is there any specific reason for doing so?

This is the example i'm referring to.

As a side note, I find it very cumbersome (especially for newbies) to modify the Webpack config in order to add polyfills. Perhaps Next.js could offer a simpler way to do this? Something like an optional file next-polyfills.js at the root of the project just like it does with next-env.d.ts for TypeScript typings.

[jamesmosier]

Next offers built-in polyfills as of 9.3. The list can be found here

[Tylerian]

Hey thanks for the answer, unfortunately that's not what I'm asking for.

[Tylerian]

Answering myself as I dug more into this...

Turns out the with-polyfills example is known to cause issues with bundling.

The proper way (and best practice) to add custom polyfills is to include them as the first line into pages/_app.js. (source: #13766 )