node.js - 如何从 docker 容器运行 webpack 构建？

Question

我正在制作的应用程序是用 ES6 编写的，其他好东西是由 webpack 在 Docker 容器中转译的。目前一切正常，从创建内部目录、安装依赖项和创建编译的包文件。

当运行容器时，它说 dist/bundle.js 不存在。除非我在主机目录中创建捆绑文件，否则它将起作用。

我尝试在第一次工作时为 dist 目录创建一个卷，但在进行更改和重建后，它并没有获取新的更改。

我想要实现的是让容器构建并运行已编译的包。我不确定 webpack 部分是否应该作为构建步骤或在运行时出现在 Dockerfile 中，因为 CMD ["yarn", "start"] 崩溃但 RUN ["yarn", "开始"] 有效。

感谢任何建议和帮助。提前致谢。

|_src
  |_index.js
|_dist
  |_bundle.js
|_Dockerfile
|_.dockerignore
|_docker-compose.yml
|_webpack.config.js
|_package.json
|_yarn.lock

docker-compose.yml

version: "3.3"
services:
  server:
    build: .
    image: selina-server
    volumes:
      - ./:/usr/app/selina-server
      - /usr/app/selina-server/node_modules
      # - /usr/app/selina-server/dist
    ports:
      - 3000:3000

Dockerfile

FROM node:latest

LABEL version="1.0"
LABEL description="This is the Selina server Docker image."
LABEL maintainer="AJ alvaroo@selina.com"

WORKDIR "/tmp"

COPY ["package.json", "yarn.lock*", "./"]

RUN ["yarn"]

WORKDIR "/usr/app/selina-server"

RUN ["ln", "-s", "/tmp/node_modules"]

COPY [".", "./"]

RUN ["yarn", "run", "build"]

EXPOSE 3000

CMD ["yarn", "start"]

.dockerignore

.git
.gitignore

node_modules
npm-debug.log

dist

package.json

{
  "scripts": {
    "build": "webpack",
    "start": "node dist/bundle.js"
  }
}

Answer 1

通过将以下行添加到 webpack.config.js，我能够在浏览器中使用 webpack 获得 docker 服务:

module.exports = {
  //...
  devServer: {
    host: '0.0.0.0',
    port: 3000
  },
};

Docker 似乎希望内部容器地址为 0.0.0.0 而不是 localhost，这是 webpack 的默认字符串。更改 webpack.config.js 规范并在构建容器时将其复制到容器中，可以在主机上的“http://localhost:3000”上识别正确的端口。它适用于我的项目；希望它对你有用。