POPULAR REACT ISSUE : How to run docker container serving a reactjs app in Azure using docker-compose?

Question

I have been following this guide: https://www.docker.com/blog/how-to-deploy-containers-to-azure-aci-using-docker-cli-and-compose/ to deploy containers in Azure. When I run "docker compose up", I see the containers running in Azure but the reactjs container doesn't start properly. The logs show it fails with :

[34mℹ[39m [90m｢wds｣[39m: webpack output is served from 
[34mℹ[39m [90m｢wds｣[39m: Content not from webpack is served from /app/public
[34mℹ[39m [90m｢wds｣[39m: 404s will fallback to /
 Starting the development server...

Following is my docker-compose file :

version: "3.8"

services:
   frontend:
     image: suyashpatel98/tic-tac-toe-frontend
     stdin_open: true
     tty: true
     environment:
       - CI=true
     depends_on:
       - backend
     expose:
       - "3000"
     ports:
       - "3000:3000"
   backend:
     image: suyashpatel98/tic-tac-toe-backend
     ports:
       - "8080:8080"

Locally both frontend and backend containers run just fine after "docker-compose up" command is executed but I run into the aforementioned error when I try to run the containers on Azure. Please find the source-code for reference here: https://github.com/suyashpatel98/tic-tac-toe-app

Answer 1

将 react-scripts 降级到 3.4.0 对我有用