I dockerized my react app using these commands:
docker build -t image-name .
docker run -e CHOKIDAR_USEPOLLING=true -v %cd%src:/app/src -p 3000:3000 --name container-name image-name
The problem is that when I save any updates in my components, they do not show up in the browser, although they have been updated in /app/src
.
I thought that -e CHOKIDAR_USEPOLLING=true
would fix it, but it didn’t.
When I go to: docker exec -it container-name bash
. I can see that everything saves correctly, but the changes don’t show up in the browser after ctrl + s
.
When I open localhost:3000
, there is a popup Compiled with problems
beacause I have some typescript warnings, but when I close it the website works great, but without updates.
My Dockerfile:
FROM node
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
EXPOSE 3000
CMD ["npm", "start"]
.dockerignore:
node_modules
Dockerfile
.git
.gitignore
.dockerignore
.env
Docker logs:
(node:26) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
(Use `node --trace-deprecation ...` to show where the warning was created)
(node:26) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
NODE_VERSION
19.0.1
2
Answers
I fixed it. You need to update this line in package.json in
scripts/start
:but if You have a big frontend the updating delay will be terrible (like few seconds for every save and update)
I think your build is still old one.
You need to maybe delete in Docker UI old build and run new build and then run that docker image.