React and Docker - Uncaught Error: не удается найти модуль «response-player»

Question

В верхней части моего компонента реагирования ( Coffee.jsx ) у меня есть этот импорт:

import ReactPlayer from 'react-player';

Пакет «реакция-игрок», безусловно, установлен, присутствует на package.json и node_modules/.

Мой код работает внутри контейнера docker. Каждый раз, когда я раскручиваю свои контейнеры, вот так:

docker-compose -f docker-compose-dev.yml up -d 

Я получаю эту ошибку:

./src/components/Coffees.jsx
Module not found: Can't resolve 'react-player' in '/usr/src/app/src/components'

это то, что консоль показывает мне:

Brewing.jsx:22 Uncaught Error: Cannot find module 'react-player'
    at webpackMissingModule (Brewing.jsx:22)
    at Module../src/components/Coffees.jsx (Brewing.jsx:22)
    at __webpack_require__ (bootstrap:781)
    at fn (bootstrap:149)
    at Module../src/App.jsx (Spotify.css:4)
    at __webpack_require__ (bootstrap:781)
    at fn (bootstrap:149)
    at Module../src/index.js (spotify-auth.js:8)
    at __webpack_require__ (bootstrap:781)
    at fn (bootstrap:149)
    at Object.0 (index.js:10)
    at __webpack_require__ (bootstrap:781)
    at checkDeferredModules (bootstrap:45)
    at Array.webpackJsonpCallback [as push] (bootstrap:32)
    at main.chunk.js:1

---

docker-compose-dev.yml :

  client:
    build:
      context: ./services/client
      dockerfile: Dockerfile-dev
    volumes:
      - './services/client:/usr/src/app'
      - '/usr/src/app/node_modules'
    ports:
      - 3000:3000
    environment:
      - NODE_ENV=development
      - REACT_APP_WEB_SERVICE_URL=${REACT_APP_WEB_SERVICE_URL}
    depends_on:
      - web

Dockerfile-dev :

# base image
FROM node:11.12.0-alpine

# set working directory
WORKDIR /usr/src/app

# add `/usr/src/app/node_modules/.bin` to $PATH
ENV PATH /usr/src/app/node_modules/.bin:$PATH

# install and cache app dependencies
COPY package.json /usr/src/app/package.json
COPY package-lock.json /usr/src/app/package-lock.json
RUN npm ci
RUN npm install react-scripts@2.1.8 -g --silent

# start app
CMD ["npm", "start"]

---

структура папок:

services/
       docker-compose-dev.yml
       node_modules/
       client/
             Dockerfile-dev
             package.json
             package-lock.json
             node_modules/
                         react-player/

---

Временное исправление:

Хак, исправляющий это, ждет некоторое время, наряду с некоторыми принудительными изменениями в моем коде либо в Coffee.jsx или Brewing.jsx .

После сохранения измененного кода пакет найден.

Затем, когда я останавливаю контейнеры и снова их поднимаю, проблема возобновляется. Я пытаюсь использовать флаг --build после up -d, но безрезультатно.

Что происходит? Как это исправить?

---

более постоянное исправление:

После удаления томов из docker-compose-dev.yml и перестройки, вот так:

#volumes:
      #- './services/client:/usr/src/app'
      #- '/usr/src/app/node_modules'

Я все еще получаю сообщение об ошибке:

client_1           | > client@0.1.0 start /usr/src/app
client_1           | > react-scripts start
client_1           | 
client_1           | Could not find a required file.
client_1           |   Name: index.html
client_1           |   Searched in: /usr/src/app/public
client_1           | npm ERR! code ELIFECYCLE
client_1           | npm ERR! errno 1
client_1           | npm ERR! client@0.1.0 start: `react-scripts start`
client_1           | npm ERR! Exit status 1
client_1           | npm ERR! 
client_1           | npm ERR! Failed at the client@0.1.0 start script.
client_1           | npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
client_1           | 
client_1           | npm ERR! A complete log of this run can be found in:
client_1           | npm ERR!     /root/.npm/_logs/2019-11-05T15_14_42_967Z-debug.log

Тогда это работает, только если я снова раскомментирую тома и запускаю контейнеры с томами. Ответ с объяснением причин

a) временного исправления b) более постоянного исправления

был бы очень признателен.

Answer 1

Управление node_modules такая боль с докером. В стеке потока ведутся отличные дискуссии о том, как запустить приложение Javascrip с помощью докера. Вот как я это делаю,

Dockerfile

FROM node:11.12.0-alpine

# first installed node_modules in cache and copy them to src folder
RUN mkdir /usr/src/cache
WORKDIR /usr/src/cache

COPY package.json .
RUN npm install -q

# now make a different directory for src code 
RUN mkdir /usr/src/app
WORKDIR /usr/src/app

# set path to run packages from node_modules
ENV NODE_PATH=/usr/src/app/node_modules/.bin

COPY . .

docker-compose.yaml

app:
    build: .
    image: app
    container_name: services.app
    volumes:
      - .:/usr/src/app
    ports:
      - 3000:5000 
    # this will copy node_modules to src folder, otherwise node_modules will be wipeed out as we don't
    # have the node_modules in the host machine
    command: /usr/src/app/entrypoint.sh prod

АМой entrypoint.sh файл выглядит как

#!/bin/bash

cp -r /usr/src/cache/node_modules/. /usr/src/app/node_modules/

exec npm start

Итак, основная идея здесь в том, что когда вы создаете образ, вы сохраняете node_modules где-то в пути, но когда вы на самом деле запускаете его, вы копируете егоnode_modules и поместите его в папку приложения. Таким образом, ваш локальный node_modules никогда не конфликтует с тем, что находится в докере.

Вы можете добавить node_modules в .dockerignore, если хотите увеличить COPY.

Answer 2

Я буду устанавливать пакеты всякий раз, когда контейнер будет установлен при запуске при остановке, а также, если он также может управлять механизмом, когда устанавливать или когда следует использовать модули времени сборки.

#!/bin/sh
npm ci
npm install react-scripts@2.1.8 -g --silent
exec npm start

С этимПри подходе к контейнеру всегда будут устанавливаться обновленные узлы модулей, также не нужно будет собираться каждый раз во время разработки.

Также мы можем контролировать это поведение.

#!/bin/sh
if [ "$PACKAGE_UPDATE" = true ] ; then
    echo 'installing fresh node modules'
    # you can also remove existing modules at this step
    npm ci
    npm install react-scripts@2.1.8 -g --silent
 fi
exec npm start

, так что докер работает неустановка пакетов будет

docker run -e PACKAGE_UPDATE=true -it my_image 

и будет монтировать анонимный том, чтобы не конфликтовать с модулями узла узла.

    volumes:
      - './services/client:/usr/src/app'
      - '/usr/src/app/node_modules'

Answer 3

Службы First Down:

docker-compose -f docker-compose-dev.yml down

Затем перестройка служб (без кэша):

docker-compose -f docker-compose-dev.yml build --no-cache

В последнем запуске службы:

docker-compose -f docker-compose-dev.yml up

Answer 4

тома в вашей композиции перезапишут во время выполнения все данные в вашей папке /app, которые вы создали в процессе сборки. Я предлагаю вам удалить тома './services/client:/usr/src/app'. с другой стороны, почему вы используете этот том '/usr/src/app/node_modules' Я не вижу никакой причины использовать его так