Использование Ubuntu Linux с установленным докером. Нет ВМ.
Я создал образ докера с помощью приложения vuejs. Чтобы включить горячую перезагрузку, я запускаю Docker-контейнер с:
docker run -it -p 8081:8080 -e "HOST=0.0.0.0" -v ${PWD}:/app/ -v /app/node_modules --name my-frontend my-frontend-image
Он запускается нормально, и я могу получить к нему доступ через браузер хоста localhost:8081
. Но когда я делаю изменения в исходных файлах и сохраняю эти изменения, они не отражаются в моем браузере, пока я не нажму F5 (горячая перезагрузка не работает).
Некоторые детали ниже:
package.json
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
сборки / webpack.dev.conf.js
devServer: {
clientLogLevel: 'warning',
...
hot: true,
...
watchOptions: {
//poll: config.dev.poll,
//aggregateTimeout: 500, // delay before reloading
poll: 100 // enable polling since fsevents are not supported in docker
}
Пытался изменить watchOptions, но это не имеет никакого эффекта.
РЕДАКТИРОВАТЬ:
Основываясь на ответе ниже, я попытался передать: CHOKIDAR_USEPOLLING=true
в качестве переменной среды для запуска Docker:
docker run -it -p 8081:8080 -e "HOST=0.0.0.0" -e "CHOKIDAR_USEPOLLING=true" -v ${PWD}:/app/ -v /app/node_modules --name my-frontend my-frontend-image
Но это не имеет никакого эффекта - все еще не в состоянии перезагрузить мои изменения. Также в приведенной ссылке сказано:
Обновление / уточнение: эта проблема возникает только при запуске вашего механизма Docker внутри виртуальной машины. Если вы используете Linux для Docker и для кодирования, у вас нет этой проблемы.
Так что не думайте, что ответ применим к моей установке - я использую Ubuntu Linux на моей машине, где я установил докер. Так что нет настройки ВМ.
Еще одно обновление - на основе приведенного ниже комментария об изменении сопоставления портов:
# Hot reload works!
docker run -it -p 8080:8080 -e "HOST=0.0.0.0" -v ${PWD}:/app/ -v /app/node_modules --name my-frontend my-frontend-image
# Hot reload fails!
#docker run -it -p 8081:8080 -e "HOST=0.0.0.0" -v ${PWD}:/app/ -v /app/node_modules --name my-frontend my-frontend-image
Так что если я перенесу карту 8080:8080
вместо 8081:8080
горячей перезагрузки работает! Обратите внимание, что приложение появляется в обоих случаях, когда я обращаюсь к нему через свой хост-браузер localhost
на вышеупомянутых портах. Просто горячая перезагрузка работает только тогда, когда я сопоставляю приложение с 8080 на моем хосте.
Но почему??
Теперь, если я сделаю:
PORT='8081'
docker run -it -p "${PORT}:${PORT}" -e "HOST=0.0.0.0" -e "PORT=${PORT}" -v ${PWD}:/app/ -v /app/node_modules --name my-frontend my-frontend-image
Горячая перезагрузка конечно работает. Но все еще не уверен, почему я не могу сопоставить внутренний порт контейнера 8080 с 8081 внешним на хосте.
Btw; Я не вижу проблемы вообще, если я использую vue-cli-service serve
вместо этого - все работает из коробки .
-p 8080:8080 -p 8081:8081