I keep getting this in devTools console:
WebSocket connection to 'wss://88b4-113-160-37-245.ap.ngrok.io:9090/ws' failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT WebSocketClient @ bundle.js:44337 ... VM12:32 WebSocket connection to 'wss://88b4-113-160-37-245.ap.ngrok.io:9090/ws' failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT WebSocket @ VM12:32 WebSocketClient @ bundle.js:44337 initSocket @ bundle.js:46251 (anonymous) @ bundle.js:46275 ...
The result being hot module replacement not working, essentially meaning I have to restart the containers to see changes.
One other thing is during compilation this was showing up:
zoomapps-advancedsample-react-frontend-1 | (node:27) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option. zoomapps-advancedsample-react-frontend-1 | (node:27) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
which seems to be an issue for many people and which I solved by replacing
react-app-rewired with craco (see this comment on github)
The issue with the dev server remained though, while in the previous version (d4c7c9a) it runs just fine.
So far the only way for me to go about this seems to be to build the frontend for my app from fresh create-react-app.
Any other ideas would be great help!
package-lock.js problem seems to have been fixed a few days ago in the lastest commit, but the other problems are still there.
UPD2: The behaviour starts occuring after switching from react-scripts 4.0.3 to 5.0.1. See solution, as well as UPD3
UPD3: The last issue I’ve been having was that the watcher in Webpack was not reflecting changes to files in the Docker container, even though
CHOKIDAR_USEPOLLING=true was set in
docker-compose.yml. Solution: instead of that, set
WATCHPACK_POLLING=true. Found here.