CODEWITHSUNDEEP
reactjsdockerdocker-composecreate-react-app
MAcabot
MAcabot

Reputation: 544

docker-compose stops immediately after starting react app created using create-react-app

I'm trying to create a react application by using the create-react-app tool as described here.

I want to use docker-compose to run the react application inside a docker container. I have taken the following steps:

On my machine I have created a directory call app and run a nodejs docker container:

mkdir app
docker run -it --rm -v "$(pwd)/app:/app" -w /app -p 3000:3000 node:13.10.1 bash

Inside the container I initialize my react app and start my application:

npx create-react-app .
yarn start

I can see the default react page when I open http://localhost:3000/#/ in my browser.

Next, I stop yarn start and exit the container.

On my machine I can start the react app by running the following:

docker run -it --rm -v "$(pwd)/app:/app" -w /app -p 3000:3000 node:13.10.1 yarn start

Again I can see the default react page when I open http://localhost:3000/#/ in my browser.

Next, I stop the react application by stopping the docker container.

Finally, I create the following docker-compose.yml file:

version: '3.7'
services:
    test-create-react-app:
        image: node:13.10.1
        volumes:
            - ./app:/app
        working_dir: /app
        ports:
            - 3000:3000
        command: ["yarn", "start"]

When I start the docker container using docker-compose the container starts and then immediately stops:

➜  test-create-react-app docker-compose up
Creating network "test-create-react-app_default" with the default driver
Creating test-create-react-app_test-create-react-app_1 ... done
Attaching to test-create-react-app_test-create-react-app_1
test-create-react-app_1  | yarn run v1.22.0
test-create-react-app_1  | $ react-scripts start
test-create-react-app_1  | ℹ ｢wds｣: Project is running at http://172.21.0.2/
test-create-react-app_1  | ℹ ｢wds｣: webpack output is served from 
test-create-react-app_1  | ℹ ｢wds｣: Content not from webpack is served from /app/public
test-create-react-app_1  | ℹ ｢wds｣: 404s will fallback to /
test-create-react-app_1  | Starting the development server...
test-create-react-app_1  | 
test-create-react-app_1  | Done in 1.31s.
test-create-react-app_test-create-react-app_1 exited with code 0

Can someone explain why the application stops when starting the Docker container using docker-compose?

Below some versions that might help you find the problem:

Docker version:

➜  test-create-react-app docker version
Client:
 Version:           19.03.6
 API version:       1.40
 Go version:        go1.12.17
 Git commit:        369ce74a3c
 Built:             Fri Feb 28 23:45:43 2020
 OS/Arch:           linux/amd64
 Experimental:      false

Server:
 Engine:
  Version:          19.03.6
  API version:      1.40 (minimum version 1.12)
  Go version:       go1.12.17
  Git commit:       369ce74a3c
  Built:            Wed Feb 19 01:06:16 2020
  OS/Arch:          linux/amd64
  Experimental:     false
 containerd:
  Version:          1.3.3-0ubuntu1~18.04.1
  GitCommit:        
 runc:
  Version:          spec: 1.0.1-dev
  GitCommit:        
 docker-init:
  Version:          0.18.0
  GitCommit:

Docker compose version:

➜  test-create-react-app docker-compose version
docker-compose version 1.25.0, build 0a186604
docker-py version: 4.1.0
CPython version: 3.7.4
OpenSSL version: OpenSSL 1.1.0l  10 Sep 2019

React app packages:

➜  test-create-react-app cat app/package.json

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Upvotes: 8

Views: 4646

Answers (3)

twilson
twilson

Reputation: 2062

The current accepted answers are no longer correct. And didn't do the job for me.

The tty: true and stdin_in: true aren't required.

What did work was changing the command: from:

/wait && yarn start

to

sh -c "/wait && yarn start"

Upvotes: 0

MAcabot
MAcabot

Reputation: 544

Adding stdin_open: true to the docker-compose file solved the issue for me. This was suggested in the corresponding github issue.

Upvotes: 14

Kevin Kopf
Kevin Kopf

Reputation: 14230

As per docker run docs:

In foreground mode ... docker run can start the process in the container and attach the console to the process’s standard input, output, and standard error. It can even pretend to be a TTY (this is what most command line executables expect) and pass along signals.

For docker-compose.yaml, the analogous docker run counterpart is tty: true. So you should add tty: true to your docker-compose.yaml and it would do the trick.

Upvotes: 8

Related Questions