Ich habe einige Probleme beim Einrichten des Hot Module Reloading in Laravel Mix in einem Docker-Container.
Ich habe die folgende Docker-Datei:
FROM php:7.4.0-fpm
RUN curl -sL https://deb.nodesource.com/setup_13.x | bash
RUN apt-get update && \
apt-get install -y -q --no-install-recommends \
nano apt-utils curl unzip default-mysql-client nodejs build-essential git \
libcurl4-gnutls-dev libmcrypt-dev libmagickwand-dev \
libwebp-dev libjpeg-dev libpng-dev libxpm-dev \
libfreetype6-dev libaio-dev zlib1g-dev libzip-dev && \
echo 'umask 002' >> /root/.bashrc && \
apt-get clean
# Docker PHP Extensions
RUN docker-php-ext-install -j$(nproc) iconv gettext gd mysqli curl pdo pdo_mysql zip && \
docker-php-ext-configure gd --with-freetype=/usr/include/ --with-jpeg=/usr/include/ && \
docker-php-ext-configure curl --with-curl
WORKDIR /var/www/html
COPY . /var/www/html
EXPOSE 80
Was ich mit der folgenden Datei docker-compose.yml baue.
# The Application
app:
build:
context: ./
dockerfile: app.dockerfile
working_dir: /var/www/html
volumes:
- ./webroot:/var/www/html
environment:
- "DB_PORT=3306"
- "DB_HOST=database"
- CHOKIDAR_USEPOLLING=true
# The Web Server
web:
build:
context: ./
dockerfile: web.dockerfile
working_dir: /var/www/html
volumes_from:
- app
ports:
- 80:80
In früheren Node.js-Apps habe ich die Daten in der Docker-Datei kopiert und das Volume in die Compose-Datei gemountet. Dies scheint jedoch nicht den gleichen Effekt mit Laravel zu haben.
Ich sehe die folgende Ausgabe in Git Bash, aber die Webseiten werden überhaupt nicht mit Änderungen neu geladen, nachdem ich npm run hot im Container ausgeführt habe, auch nicht mit einer manuellen Aktualisierung:
Trotzdem funktioniert npm run watch-poll, das ich zuvor verwendet habe, immer noch wie erwartet.
Normalerweise werden beim Anzeigen der Anwendung Protokolle von HMR und WDS in der Konsole im Browser angezeigt. In dieser Situation sehe ich jedoch keine Ausgänge.
Unten habe ich auch meine Datei webpack.mix.js aufgenommen. Ich habe mit einigen Optionen herumgespielt, wie z. B. dem Port und dem Host, da ich weiß, dass sie beim Ausführen in einem Container auf eine bestimmte Weise konfiguriert werden müssen. Jede Hilfe wäre dankbar, da ich Schwierigkeiten habe, herauszufinden, wo ich falsch liege.
mix.options({
hmrOptions: {
host: 'localhost',
port: '80'
},
});
mix.webpackConfig({
mode: "development",
devtool: "inline-source-map",
devServer: {
disableHostCheck: true,
headers: {
'Access-Control-Allow-Origin': '*'
},
host: "0.0.0.0",
port: 80
},
});
Bearbeiten:
Fehlerausgabe beim Ausführen von npm run hot, nachdem beide Hostwerte auf web gesetzt wurden:
> @ hot /var/www/html
> cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js
events.js:298
throw er; // Unhandled 'error' event
^
Error: listen EADDRNOTAVAIL: address not available 172.25.0.4:80
at Server.setupListenHandle [as _listen2] (net.js:1292:21)
at listenInCluster (net.js:1357:12)
at GetAddrInfoReqWrap.doListen [as callback] (net.js:1496:7)
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:69:10)
Emitted 'error' event on Server instance at:
at emitErrorNT (net.js:1336:8)
at processTicksAndRejections (internal/process/task_queues.js:84:21) {
code: 'EADDRNOTAVAIL',
errno: -99,
syscall: 'listen',
address: '172.25.0.4',
port: 80
}
quelle
Antworten:
Das Problem ist in
Sie können localhost nicht verwenden, da es sich in diesem Fall auf Ihren APP-Container bezieht. Verwenden Sie
web
stattdessen stattdessen localhost, da compose die Dienstnamen für Sie auflöst:quelle
Webpack hat möglicherweise ein Problem mit dem Datei-Watcher im Docker. Versuchen Sie, die Abrufoption in der devServer-Konfiguration hinzuzufügen.
Für das
listen EADDRNOTAVAIL: address not available 172.25.0.4:80
Problem:docker ps
docker stop [container_id]
quelle