Running create react app on docker compose - "Error: cannot find module 'react'"

Question

I am trying to run my backend + database + frontend on Docker compose (newbe here). When I remove the docker containers with prune and rebuild the containers from fresh it works as expected:

frontend_1  | yarn run v1.22.5
frontend_1  | $ react-scripts start
frontend_1  | ℹ ｢wds｣: Project is running at http://192.168.0.3/
frontend_1  | ℹ ｢wds｣: webpack output is served from 
frontend_1  | ℹ ｢wds｣: Content not from webpack is served from 
/frontend/myapp/public
frontend_1  | ℹ ｢wds｣: 404s will fallback to /
frontend_1  | Starting the development server...

However, if I shut down with ctrl+c and restart docker with "docker-compose up" I get an error:

frontend_1  | yarn run v1.22.5                                                   
frontend_1  | $ react-scripts start 
frontend_1  | node:internal/modules/cjs/loader:922
frontend_1  |   throw err;
frontend_1  |   ^
frontend_1  | 
frontend_1  | Error: Cannot find module 'react'
frontend_1  | Require stack:
frontend_1  | - /usr/local/lib/node_modules/react-scripts/scripts/start.js
frontend_1  |     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:919:15)
frontend_1  |     at Function.resolve (node:internal/modules/cjs/helpers:98:19)
frontend_1  |     at Object. (/usr/local/lib/node_modules/react-scripts/scripts/start.js:52:31)
frontend_1  |     at Module._compile (node:internal/modules/cjs/loader:1102:14)
frontend_1  |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1131:10)
frontend_1  |     at Module.load (node:internal/modules/cjs/loader:967:32)
frontend_1  |     at Function.Module._load (node:internal/modules/cjs/loader:807:14)
frontend_1  |     at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12)
frontend_1  |     at node:internal/main/run_main_module:17:47 {
frontend_1  |   code: 'MODULE_NOT_FOUND',
frontend_1  |   requireStack: [ '/usr/local/lib/node_modules/react-scripts/scripts/start.js' ]
frontend_1  | }
frontend_1  | error Command failed with exit code 1.
frontend_1  | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
myapp_frontend_1 exited with code 1

I am using yarn to install packages on my development machine. I then copy the files and the packages.json file (but not the node_modules dir) to my deployment machine.

Dockerfile:

FROM node:alpine
RUN apk update
RUN apk add git

WORKDIR /frontend
COPY myapp/package.json /frontend
 
RUN npm install react-scripts -g
RUN npm install react -g
RUN yarn install --network-timeout 1000000
COPY ./myapp/ /frontend
CMD ["yarn", "run", "start"]

Docker-compose file:

services:
  ...
  ...
  frontend:
    build: ./frontend
    command: ["yarn", "--cwd", "./myapp", "run", "start"]
    volumes:
      - ./frontend:/frontend
      - ./frontend/node_modules
    ports:
      - "3000:3000"
    env_file: ./.env
    stdin_open: true

volumes:
  static-data:
    driver: local
  node-modules:

Directory structure on the deployment machine:

├── myapp
│   ├── build
│   ├── package.json
│   ├── public
│   ├── README.md
│   ├── src
│   └── yarn.lock
├── Dockerfile
└── requirements.txt

I have tried for hours and am cycling between errors "Cannot find module 'react-scripts'" and "Cannot find module 'react'" and various others. Any suggestions what might be wrong with my code/setup?

Running create react app on docker compose - "Error: cannot find module 'react'"

0 Answers