React app exiting in docker container with exit code 0

Question

I am trying to create a docker-compose setup with nginzx, flask, and react. I started my react app with react-create-app (https://github.com/facebook/create-react-app) and haven't changed anything from it yet.

My Dockerfile for the react app is:

FROM node:10

WORKDIR /usr/src/app

# Install app dependencies
# A wildcard is used to ensure both package.json AND package-lock.json are copied
COPY package*.json ./
RUN npm install --verbose

# Bundle app source
COPY . .


EXPOSE 3000
CMD ["npm", "start"]

The compose script is:

version: '3.1'

services:
    nginx:
        image: nginx:1.15
        container_name: nginx
        volumes:
            - ../:/var/www
            - ./nginx-dev.conf:/etc/nginx/conf.d/default.conf
        ports:
            - 80:80
        networks:
            - my-network
        depends_on:
            - flask
            - react
    react:
        build:
            context: ../react-app/
            dockerfile: ./Dockerfile
        container_name: react
        volumes:
            - ../react-app:/usr/src/app
        networks:
            my-network:
                aliases:
                    - react-app
        expose:
            - 3000
        ports:
            - "3000:3000"
    flask:
        ...
networks:
    my-network:

The flask and nginx containers start fine, the output for react is:

react    | 
react    | > [email protected] start /usr/src/app
react    | > react-scripts start
react    | 
react    | ℹ ｢wds｣: Project is running at http://my-ip-address/
react    | ℹ ｢wds｣: webpack output is served from 
react    | ℹ ｢wds｣: Content not from webpack is served from /usr/src/app/public
react    | ℹ ｢wds｣: 404s will fallback to /
react    | Starting the development server...
react    | 
react    | 
react    | npm verb lifecycle [email protected]~start: unsafe-perm in lifecycle true
react    | npm verb lifecycle [email protected]~start: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/usr/src/app/node_modules/.bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin
react    | npm verb lifecycle [email protected]~start: CWD: /usr/src/app
react    | npm info lifecycle [email protected]~poststart: [email protected]
react    | npm verb exit [ 0, true ]
react    | npm timing npm Completed in 1727ms
react    | npm info ok 
react exited with code 0

Solution 1

Adding: stdin_open: true to the React component of my docker-compose file fixed my issue.

Example:

version: '3.1'

services:
    react:
        build:
            context: ../react-app/
            dockerfile: ./Dockerfile
        container_name: react
        volumes:
            - ../react-app:/usr/src/app
        networks:
            my-network:
                aliases:
                    - react-app
        expose:
            - 3000
        ports:
            - "3000:3000"
        stdin_open: true

Solution 2

It looks like an issue with [React-Scripts] v3.4.1. Please look into this link

Solution 3

Ran into same issue. Below mentioned steps resolved my problem: 1. add stdin_open: true

version: '3.1'

services:
  nginx:
    .
    .
  react:
    stdin_open: true
    .
    .

2. Do not forget to build the container again after the above mentioned change is made.

docker-compose down
docker-compose up --build

Comments

[APorter1031]

note that if I cd into react-app and run npm start, everything works as expected.

[CyberMew]

Try setting tty true as well.

[APorter1031]

yes, this is very relevant. Thank you very much. I will post the snippet that fixed my setup.

[pyofey]

worked! github.com/facebook/create-react-app/issues/8688

[APorter1031]

why did you post this as a new answer if you still need stdin_open: true?

[Fadyboy]

I thought initially solution would work as I saw it being used somewhere else admittedly without testing it properly. That's why I made the correction afterwards. I can delete my answer if that's better