danalloway / react-country-flag

React component for emoji/svg country flags.
https://danalloway.github.io/react-country-flag/
MIT License
255 stars 43 forks source link

ReferenceError: self is not defined after 2.2.0 update #26

Closed upteran closed 4 years ago

upteran commented 4 years ago

Hi, thanks for your work at first

Describe the bug

After upgrading to 2.2.0, compile errors with:

Failed to compile.

14:05:30] [Step 4/5] > Build error occurred [14:05:30] [Step 4/5] ReferenceError: self is not defined [14:05:30] [Step 4/5] at Object. (/app/node_modules/react-country-flag/dist/index.js:553:38)

System information

System macOS Catalina 10.15.3 node 12.8.0 npm 6.10.3 react-country-flag 2.2.0

Additional context

with 2.1.0 ver everything works

say if you need more extend info or reproduced some repo

Amorem commented 4 years ago

Rollback to 2.1.0 didn't help, i have switched to country-emoji

Poky85 commented 4 years ago

Works in 2.1.0. Of course you have to fix version in package.json e.g. "react-country-flag": "2.1.0", not "react-country-flag": "^2.1.0",

danalloway commented 4 years ago

looking into this now, thanks for the heads up @upteran!

@Amorem have you tried the solution by @Poky85 ?

danalloway commented 4 years ago

@upteran I'm not able to reproduce the error locally

the example project uses the latest version 2.2.0 and I also use the project internally on a React project that is also on the latest version

a simple reproduced CodeSandbox or something would be huge, then I can track this thing down and fix it thanks!

upteran commented 4 years ago

@danalloway my fault, I didn't describe that I used package in project with server side rendering I reproduced simple example used with SSR(next.js), https://github.com/upteran/react-flag-error-example , you can use it for check error locally

For check error you need

when code run on server side it crash with error, on this line

searchParams: 'URLSearchParams' in self

I suppose, because of node environment, on client everything work of course

danalloway commented 4 years ago

ah, thank you @upteran I'll try and track down the culprit dependancy

upteran commented 4 years ago

@danalloway I suppose error in core-js/stable polyfills. And you sure that package needed all this polyfills? maybe this babel's part of work ? inside core-js I found this comment

It's recommended to use @babel/preset-env and browserslist
to only include the polyfills necessary for the target browsers.

And maybe it's better load only useful code for specific environment with babel and browserslist, instead of loading all polyfills ?

danalloway commented 4 years ago

@upteran yep I think that is it the error was introduced in the last version when I added those polyfills for IE support

danalloway commented 4 years ago

@upteran @Poky85 just released v2.3.0 let me know if your issue is resolved

carlymarshall commented 4 years ago

v2.3.0 works with NextJS for me. Thanks.

upteran commented 4 years ago

Yep, with 2.3.0 everything ok