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

我正在制作的应用程序是用ES6编写的，其他好东西是通过Docker容器中的网页包传输的。目前，从创建内部目录、安装依赖项到创建已编译的捆绑文件，一切都可以正常工作

当运行容器时，它表示dist/bundle.js不存在。除非我在主机目录中创建bundle文件，否则它将正常工作

我已经尝试过在dist目录第一次工作时为它创建一个卷，但是在进行更改和重建之后，它不会接受新的更改

我试图实现的是让容器构建并运行已编译的包。由于

CMD[“纱线”，“开始”]

崩溃，但

RUN[“纱线”，“开始”]

起作用，我不确定网页包部分是作为构建步骤还是在运行时应该在Dockerfile中

任何建议和帮助都将不胜感激。提前谢谢

|_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"
  }
}

---

我没有包括我的src树结构，但它基本上与你的相同， 我使用下面的docker设置来运行它，以及我们每天开发东西的方式

在package.json中，我们有

"scripts": {
    "start": "npm run lint-ts && npm run lint-scss && webpack-dev-server --inline --progress --port 6868",
}

dockerfile

FROM node:8.11.3-alpine

WORKDIR /usr/app

COPY package.json .npmrc ./

RUN mkdir -p /home/node/.cache/yarn && \
  chmod -R 0755 /home/node/.cache && \
  chown -R node:node /home/node && \
  apk --no-cache add \
  g++ gcc libgcc libstdc++ make python

COPY . .

EXPOSE 6868

ENTRYPOINT [ "/bin/ash" ]

docker-compose.yml 版本：“3”

请注意，此Dockerfile不适用于生产环境，它适用于作为根目录运行的dev环境

有了这个docker文件，我就明白了

因为alpine在musl上，我们在glib上，如果我们在主机上安装节点模块，编译的本机将无法在docker容器上工作，一旦容器启动，如果出现错误，我们运行此程序来修复它（现在有点麻烦）

---

我知道，但它可以工作。

尝试更改

包.json中的开始脚本以首先执行构建（这样做，您不需要
运行
命令来在
Dockerfile中执行构建：

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

通过在
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在主机上。它对我的项目有效；希望它对你的项目有效

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

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