Question

我有一个reactjs和redux，项目使用webpack，它是使用Dockerfile构建的。它是一个带有一些先前配置的样板，您可以通过克隆此repo来获取文件：https://github.com/CheesecakeLabs/react-redux-boilerplate。

因此，为了运行react服务器，我创建了一个docker-compose.yml文件：

version: '2'

services:
  frontend:
    image: redux
    container_name: redux
    environment:
      - NODE_ENV=development
      - PORT=5000
    ports:
      - "5000:5000"

服务器正常使用dev选项启动，但是当我对项目下的index.js文件进行任何更改时，即使对于package.json下的依赖项，也不会更新并进行更改：

"webpack-dev-middleware": "^1.6.1",
"webpack-hot-middleware": "^2.0.0",
"webpack-manifest-plugin": "^1.1.0"

我的操作系统是Linux：SUSE 42.1。

感谢您的时间！

编辑1：

对Dockerfile进行了一些更改，以便使用开发选项运行服务器：

FROM node:6

RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app

COPY package.json /usr/src/app/
COPY yarn.lock /usr/src/app/
RUN yarn

COPY . /usr/src/app

RUN yarn build
EXPOSE 5000

CMD ["yarn", "dev"]

编辑2： 修改我的Dockerfile到此和docker-compose文件仍然是相同的。但是当我运行docker-compose时，它会触发这个错误：

Dockerfile：

FROM node:6

RUN npm install -g webpack
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app

COPY package.json /usr/src/app
COPY yarn.lock /usr/src/app
RUN yarn

EXPOSE 5000

CMD bash -c "yarn build && exec yarn dev"

错误：

error Couldn't find a package.json file in "/usr/src/app"

这到底是做什么的？

COPY package.json /usr/src/app
COPY yarn.lock /usr/src/app

编辑3： ls -alh输出：

drwxr-xr-x 5 giovanni users 4,0K Ago  1 14:19 .
drwxr-xr-x 5 giovanni users   88 Ago  1 14:20 ..
-rw-r--r-- 1 giovanni users  392 Ago  1 14:19 .babelrc
-rw-r--r-- 1 giovanni users 1,1K Ago  1 14:19 circle.yml
-rw-r--r-- 1 giovanni users  211 Ago  1 15:05 Dockerfile
-rw-r--r-- 1 giovanni users   18 Ago  1 14:19 .dockerignore
-rw-r--r-- 1 giovanni users  294 Ago  1 14:19 .editorconfig
-rw-r--r-- 1 giovanni users   16 Ago  1 14:19 .eslintignore
-rw-r--r-- 1 giovanni users   34 Ago  1 14:19 .eslintrc.json
drwxr-xr-x 8 giovanni users  163 Ago  1 14:19 .git
-rw-r--r-- 1 giovanni users   12 Ago  1 14:19 .gitattributes
-rw-r--r-- 1 giovanni users   82 Ago  1 14:19 .gitignore
-rw-r--r-- 1 giovanni users 3,8K Ago  1 14:19 package.json
-rw-r--r-- 1 giovanni users  512 Ago  1 14:19 postcss.config.js
-rw-r--r-- 1 giovanni users  384 Ago  1 14:19 README.md
-rw-r--r-- 1 giovanni users  997 Ago  1 14:19 server.js
drwxr-xr-x 9 giovanni users  199 Ago  1 14:19 src
-rw-r--r-- 1 giovanni users   66 Ago  1 14:19 stylelint.config.js
drwxr-xr-x 2 giovanni users   28 Ago  1 14:19 tests
-rw-r--r-- 1 giovanni users 1,7K Ago  1 14:19 webpack.config.js
-rw-r--r-- 1 giovanni users 2,2K Ago  1 14:19 webpack.config.production.js
-rw-r--r-- 1 giovanni users 1,5K Ago  1 14:19 webpack.config.server.js
-rw-r--r-- 1 giovanni users 1,4K Ago  1 14:19 webpack.config.vendor.js
-rw-r--r-- 1 giovanni users 220K Ago  1 14:19 yarn.lock

编辑4（最终）：

确保您的docker-compose.yml文件位于正确的文件夹中...问题已解决！

解决方案是使用docker-compose.yml文件中的卷将主机上的源代码链接到容器：

volumes:
 - .:/usr/src/app

所以我的docker-compose文件看起来像这样：

version: '2'

services:
  frontend:
    image: redux
    container_name: redux
    volumes:
      - .:/usr/src/app
    environment:
      - NODE_ENV=development
      - PORT=5000
    ports:
      - "5000:5000"

和Dockerfile：

FROM node:6

RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
RUN npm install -g webpack
EXPOSE 5000

CMD bash -c "yarn && exec yarn dev"

Answer 1

您需要使用的是您的情况下的卷。我相信你正在主机上进行开发并试图测试它

COPY package.json /usr/src/app/
COPY yarn.lock /usr/src/app/
RUN yarn

COPY . /usr/src/app

上述COPY命令正在复制该实例的代码并将其放入docker镜像中。您在主机系统中对文件所做的任何更改都不会影响基于这些图像的映像或正在运行的容器。将其视为更多快照。因此，对于您的开发，请更改docker文件，如下所示

FROM node:6

RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
EXPOSE 5000

CMD bash -c "yarn build && exec yarn dev"

将docker-compose文件更改为

version: '2'

services:
  frontend:
    image: redux
    container_name: redux
    volumes:
      - .:/usr/src/app
    environment:
      - NODE_ENV=development
      - PORT=5000
    ports:
      - "5000:5000"

该卷会将泊坞窗内的当前文件夹映射到/usr/src/app，您所做的任何更改都将立即在容器内可用。

我假设yarn dev执行代码更改所需的任何热重新加载。

Webpack不会使用docker重新编译文件

1 个答案: