How to properly polyfill URLSearchParams in webpack?

Question

I have a project that uses fetch polyfill from isomorphic-fetch. I would like to use URLSearchParams with it to submit POST data. For fetch to support URLSearchParams it first checks if it is available in global object. I though to use this polyfill for it but I don't know how to properly import it in webpack, so that fetch notices that it is available.

How can I accomplish this? Thank you!

score 25 · Accepted Answer · answered Dec 05 '16 at 09:33

25

I had the same issue, had to switch to other polyfill to make it work, try this:

https://github.com/jerrybendy/url-search-params-polyfill

then simply add it to your webpack config:

entry: {
  bundle: [
    ...
    'url-search-params-polyfill',
    './src/entry'
  ]
}

answered Dec 05 '16 at 09:33

peter46

389
4
9

2

There's also a more popular polyfill: https://github.com/WebReflection/url-search-params – Dmitrii Sorin Oct 13 '18 at 10:13
@DmitriiSorin that's the exact same one linked in the question – peter46 Nov 16 '18 at 14:21
right you are. I added a response to original answer below. – Dmitrii Sorin Nov 24 '18 at 09:55
@DmitriiSorin WebReflections polyfill is deprecated. `This polyfill has been improved, better tested, and moved under the ungap umbrella. ` [@ungap/url-search-params.](https://github.com/ungap/url-search-params) – davidhartman00 Jan 14 '20 at 18:56
1

or import 'core-js/stable/url-search-params'; – Ron Jonk Jan 12 '21 at 15:23

score -1 · Answer 2 · answered Nov 24 '18 at 09:54

-1

How to include the WebReflection/url-search-params polyfill into webpack bundle:

entry: [
  'url-search-params/build/url-search-params.max',
  ...otherPolyfills,
  './your.entrypoint.jsx',
],

answered Nov 24 '18 at 09:54

Dmitrii Sorin

3,855
4
31
40

2

This one is deprecated, it mentions to use https://github.com/ungap/url-search-params instead. – Hinrich Jan 08 '20 at 10:54

How to properly polyfill URLSearchParams in webpack?

2 Answers2