Реакция Webpack не перестраивается при редактировании файла вне контейнера Docker (на Mac)

Я использовал create-Reaction-app для создания приложения реагирования в контейнере Docker. Когда я редактирую App.js внутри контейнера, приложение автоматически перестраивается и браузер перезагружается. Но когда я редактирую файл вне контейнера (на хосте), он не перестраивается.

Это проблема webpack/watch - но, возможно, также имеет какое-то отношение к запуску Docker на Mac? Любая помощь будет оценена.

Я предполагаю, что такие вещи вполне нормальны для настройки разработчика (то есть - с помощью docker для создания среды сборки, но с использованием монтирования для реального кода).

Вот репозиторий Github с тем, что я использую.

3 ответа

Решение

Я понял это сам. Это была конфигурация webpack, которая не позволяла редактированию извне контейнера вызывать перестройку и перезапуск. Уловка (и, видимо, это устаревший вариант)

watchOptions {
  poll: 100
}

ПРИМЕЧАНИЕ: использование poll:1000 привело к обновлению только каждого другого редактирования. Используя 100 работ каждый редактировать. не уверен почему.

Так что для моего внутреннего API я использую node/expressjs. Здесь мне нужно было установить и запустить webpack и nodemon. (nodemon нужна была опция -L, чтобы работать при редактировании вне контейнера).

Мой веб-интерфейс создается с использованием приложения create-реакции-приложения, в котором не отображается ни одна из настроек веб-пакета. Я должен был бежать

npm run eject

выставить конфигурацию webpack (которую я редактировал в файле config/webpackDevServer.config.js).

Теперь использование eject не одобряется, потому что "вы не можете вернуться назад"... но так как я использую docker-контейнер и использую create-реагировать-app / eject при сборке контейнера - я эффективно избавился от этого нежелательная ситуация. (хотя мне, возможно, придется исправить мой файл докера, если что-то изменится на мне).

Все эти изменения можно найти в моих файлах докера здесь https://github.com/roocell/fullstack_react_nodejs_in_docker

В моем случае включение этой переменной среды разрешило ее:

CHOKIDAR_USEPOLLING=true

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

PS: загрузка процессора была довольно высокой, поэтому мне, к сожалению, пришлось уменьшить интервал проверок, установив CHOKIDAR_INTERVAL=1000,


Вы можете установить эту переменную в docker-compose.yml файл …

    environment:
      - CHOKIDAR_USEPOLLING=true

... или в Dockerfile...

ENV CHOKIDAR_USEPOLLING=true

... или через командную строку что-то вроде:

docker run -e CHOKIDAR_USEPOLLING=true my-app

Вы должны связать папку вашего хоста, содержащую файлы вашего приложения, с контейнером, используя Тома. Еще лучше было бы использовать Docker-Compose, так как вы используете несколько контейнеров.

Контейнеры Docker предназначены исключительно для запуска кода, а не для его редактирования. Вы действительно не должны использовать редактор внутри контейнера.

Однако я думаю, что ваша текущая структура приложения неверна. Ваш API должен предоставлять данные, которые ваш интерфейс извлекает и отображает. В настоящее время ваш бэкэнд-код функционирует только как маршрутизатор для вашего веб-приложения, но вместо этого вы должны использовать клиентский маршрутизатор и создать RESTFUL JSON-send API. Тогда из вашего клиентского JavaScript вы можете сделать fetch вызовы вашего API, который должен res.send немного JSON.

Другие вопросы по тегам