使用 ddev / docker 容器中的特定端口访问 webpack 开发服务器输出

Question

在原生Debian上，我的开发方式如下：

Webpack 开发服务器：

devServer: {
  host: "192.168.XX.XX",
  port: 8080,
  disableHostCheck: true,
  inline: true
}

通过运行ning npm 运行 dev 手动启动 webpack 开发服务器文件现在可由 192.168.XX.XX:8080/path/to/file

访问

在我的 Apache 配置中，我定义了一个反向代理以使文件可以通过干净的路径访问：my-host.dev/node/path/to/file

Apache 配置：

 ProxyPass /node/ http://192.168.XX.XX:8080/ retry=0 timeout=5
 ProxyPassReverse /node/ http://192.168.XX.XX:8080/

如果我想在我的 ddev 容器中有相同的基本行为，我是否需要定义一个新服务？或者我如何路由 webpack 生成的文件可以通过 mysitename.ddev.site/path/to/file 或至少 mysitename.ddev.site:8080/path/to/file?

访问的端口

Answer 1

我首先要做的是公开端口。最简单的技术是添加一个 .ddev/docker-compose.webpack.yaml 来公开您的端口 8080:

version: "3.6"
services:
  web:
    ports:
      - 8080:8080

ddev start，然后像往常一样使用它。它应该与 http://<yourproject>.ddev.site:8080 或 http://localhost:8080

一起使用

一种更优雅的技术是使用 ddev 的 built-in 反向代理，因此 .ddev/docker-compose.webpack.yaml 会：

version: "3.6"
services:
  web:
    expose:
      - 8080
    environment:
    - HTTP_EXPOSE=${DDEV_ROUTER_HTTP_PORT}:80,${DDEV_MAILHOG_PORT}:8025,8080:8080
    - HTTPS_EXPOSE=${DDEV_ROUTER_HTTPS_PORT}:80,${DDEV_MAILHOG_HTTPS_PORT}:8025,8081:8080

通过此设置，您将使用 http://projectname.ddev.site:8080 或 https://projectname.ddev.site:8081 访问 webpack。由于整个事情都是通过反向代理管理的，因此您可以使用相同的配置同时拥有多个项目运行。（而且您不必在 http 和 https 之间来回切换。）

使用 ddev / docker 容器中的特定端口访问 webpack 开发服务器输出

Accessing webpack dev server output with specific port in ddev / docker container

docker

ddev