[React Refresh] Failed to set up the socket connection.

[sakibul-islam]

When I first open the popup/options page, I get this error. But the auto-refresh works fine.

[vu9huy]

I got same problem

[UchennaOkafor]

How did you guys fix this problem?

[osarhan]

I got the same problem. havent solved it. If someone can respond with their solution, that would be great

[udaya28]

I got the same problem.. any fixes?

[UchennaOkafor]

I just ended up using this template https://github.com/guocaoyi/create-chrome-ext

Specifically their vite react typescript template https://github.com/guocaoyi/create-chrome-ext/tree/main/template-react-ts

It's more lightweight, has less bugs, less bloat and works better. @udaya28 @osarhan

[Hawstein]

Encounter the same problem.

Just head to file webpack.config.js and replace the following line

isDevelopment && new ReactRefreshWebpackPlugin(),

to

isDevelopment && new ReactRefreshWebpackPlugin({ overlay: false }),

This will ignore the error overlay integration and fix the warning.

[sakibul-islam]

Thanks @Hawstein, it worked.

[WynMars]

use "npm run build" instead, anyway, I still encounter other problems and decide to go with other lightweight template

[wilmoore]

use "npm run build" instead, anyway, I still encounter other problems and decide to go with other lightweight template

@WynMars Curious which one you ended up going with?