Frage Webpack-dev-server kann nicht im Andockfenster ausgeführt werden


Ich habe ein Docker-Image erstellt, das eine einfache Reaction-App mit Webpack aus dem Container bedient, aber ich bekomme nichts im Browser.

Hier sind meine Konfigurationsdateien

package.json

{
  "name": "invas_client",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack --inline --content-base ."
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "react": "^0.14.7",
    "react-dom": "^0.14.7",
    "react-router": "^2.0.0"
  },
  "devDependencies": {
    "babel-core": "^6.5.1",
    "babel-loader": "^6.2.2",
    "babel-preset-es2015": "^6.5.0",
    "babel-preset-react": "^6.5.0",
    "http-server": "^0.8.5",
    "webpack": "^1.12.13",
    "webpack-dev-server": "^1.14.1"
  }
}

webpack.config.js

module.exports = {
    entry: './index.js',

    output: {
        filename: 'bundle.js',
        publicPath: ''
    },

    module: {
        loaders: [
            { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015&presets[]=react' }
        ]
    }
}

Dockerfile

# Use starter image
FROM node:argon

# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app

# Install app dependencies
COPY package.json /usr/src/app/
RUN npm install

# Bundle app source
COPY . /usr/src/app

# Expose port
EXPOSE 8080

# Default command to run
CMD ["npm", "start"]

Was funktioniert gut?

Wenn ich renne npm start, das webpack-dev-server läuft normal, und wenn ich gehe http: // localhost: 8080Ich sehe meine Seite.

Was nicht funktioniert

Wenn ich meinen Server mit dem Andockfenster ausführe, mit dem folgenden Befehl:

docker build -t anubhav756/app . && docker run -p 80:8080 anubhav756/app 

Die Logs zeigen alles, was normal funktioniert, aus dem Container heraus, aber wenn ich meinen Browser darauf zeige http: // localhost, Ich bekomme ERR_CONNECTION_RESET

Beispielcode ist vorbei Hier


9
2017-09-22 06:45


Ursprung


Antworten:


Sie hören tatsächlich nur auf localhost. Um von außen erreichbar zu sein, ersetzen Sie die folgende Zeile in Ihrer package.json Datei:

"start": "webpack-dev-server --inline --content-base ."

durch :

"start": "webpack-dev-server --host 0.0.0.0 --inline --content-base ."

Verwandte Diskussion: https://github.com/webpack/webpack-dev-server/issues/147


29
2017-09-22 12:01



Ich möchte nur etwas zu Raphayols Antwort hinzufügen, wenn Sie das Hot-Reload von webpack-dev-server im Container nicht aktivieren können.
Ich konnte webpack oder webpack-dev-server Uhr (--watch) -Modus nicht arbeiten lassen, auch nachdem ich meinen Projektordner in den Container geladen habe.
Um dies zu beheben, müssen Sie verstehen, wie webpack Dateiänderungen in einem Verzeichnis erkennt.
Es verwendet eine von 2 Software, die OS-Level-Unterstützung für die Überwachung von Dateiänderungen inotify und fsevent hinzufügen. Standard-Docker-Images haben normalerweise diese nicht (speziell inotify für Linux) vorinstalliert, so dass Sie sie in Ihrer Docker-Datei installieren müssen.
Suchen Sie nach inotify-tools-Paket im Paketmanager Ihrer Distribution und installieren Sie es. Glücklicherweise haben alle Alpen-, Debian-, Centos dies.


2
2017-10-20 07:43