Debuggen Sie die Webpack-Dev-Server-Anwendung im Docker-Container

Ich verwende webpack-dev-server, um eine Nestjs-Anwendung in einem Docker-Container auszuführen. Alles ist in Betrieb, aber ich kann die Anwendung nicht von meiner VS-Code-Instanz aus debuggen. Ich versuche, den 9229-Port mithilfe dieser Konfiguration auf dem webpack.config.jsfolgenden Konto freizulegen :

devServer: {
  host: '0.0.0.0',
  port: 9229,
},

Wenn ich netstat -lim Container laufe, kann ich sehen, dass der Knoten den 9229-Port nicht überwacht:

Ich mache den Port 9229 in den Dockerfile- und Docker-Compose-Dateien verfügbar. Die Docker-Datei:

FROM node:12.16.1-alpine
WORKDIR /usr/src/app
COPY package.json yarn.lock ./
RUN yarn
COPY . .
EXPOSE 3000
EXPOSE 9229
CMD [ "yarn", "run", "start:debug"]

Und die Datei docker-compose.yml:

version: '3.7'
services:
    open-tuna-api:
        image: opentunaapi
        ports:
            - 3000:3000
            - 9229:9229
        volumes: 
            - ./dist:/usr/src/app/dist
            - ./:/usr/src/app
        networks:
            - open-tuna-network
        expose: 
            - 9229
networks:
    open-tuna-network:

Und dies ist das Skript, mit dem ich die Anwendung ausführe:

"start:debug": "webpack --config webpack.config.js && node --inspect=0.0.0.0:9229 node_modules/webpack-dev-server/bin/webpack-dev-server.js",

Meine Startkonfiguration lautet wie folgt:

{
    "name": "Attach",
    "preLaunchTask": "compose-up",
    "stopOnEntry": true,
    "type": "node",
    "request": "attach",
    "port": 9229,
    "cwd": "${workspaceFolder}", // the root where everything is based on
    "localRoot": "${workspaceFolder}", // root of all server files
    "remoteRoot": "/usr/src/app", // workspace path which was set in the dockerfile
    "outFiles": ["${workspaceFolder}/dist/**/*.js"], // all compiled JavaScript files
    "protocol": "inspector",
    "restart": true,
    "sourceMaps": true,
    "trace": "verbose",
    "address": "0.0.0.0",
    "skipFiles": [
        "<node_internals>/**"
    ],
}

Und wenn ich diese Konfiguration mit laufendem Container ausführe, erhalte ich die Meldung, dass VS Code keine Verbindung zum Prozess herstellen kann.

Meine Frage lautet also: Gibt es eine Möglichkeit, die JavaScript / TypeScript-App zu debuggen, die webpack-dev-serverin einem Docker-Container ausgeführt wird? Was ist in meiner Umgebung falsch?

Danke für die Hilfe.

BEARBEITEN

Anscheinend hat mein Problem keine Beziehung zu Docker, da ich es außerhalb des Containers reproduzieren kann.

Schauen Sie sich Ihre Konfiguration an und stellen Sie sicher, dass Sie das programFeld einschließen . Und zeigen Sie auf die richtige Datei unter node_modules.

"program": "${workspaceRoot}/node_modules/webpack-dev-server/bin/webpack-dev-server.js"

Das sollte dich zum Laufen bringen.

Wenn Sie mehr darüber erfahren möchten, gibt es eine längere Konversation, die Sie möglicherweise nützlich finden - lesen Sie diesen Kommentar auf dem GitHub-Repo des Webpack-Dev-Servers .