我在使用 Dockerfile 构建 React 应用程序和 webpack 时遇到问题

Question

我正在准备一个 Docker 图像，其中包含使用 webpack 构建的 React 应用程序。我可能错过了一些东西，因为在执行 yarn build 之后我收到关于缺少 webpack 的错误。但是我在 node_modules/.bin/webpack 中有 webpack，它是使用 COPY . /web

复制的

$ webpack --mode production
/bin/sh: webpack: not found
error Command failed with exit code 127.

我只尝试了运行 yarn，但这显然不会构建应用程序，但我检查了容器以确认文件复制。

package.json

{
  "name": "@mySweetApp/my-app",
  "version": "0.0.1",
  "description": "My Swee App",
  "main": "./src/index.js",
  "private": true,
  "license": "MIT",
  "scripts": {
    "build": "webpack --mode production",
    "start": "webpack-dev-server --mode development --open --hot"
  },

Docker文件

FROM node:12.2.0-alpine as node

RUN mkdir -p /web

WORKDIR /web

#Copy dependency definition
COPY package.json /web

RUN yarn install

#Copy all files
COPY . /web

RUN yarn build

文件树（删除不需要的东西）

  },├── .babelrc
├── docker
│   ├── default.conf
│   ├── .dockerignore
│   └── ssl
├── Dockerfile
├── node_modules
│   ├── @babel
│   ├── babel-core
│   ├── .bin
│   │   ├── eslint -> ../../../../node_modules/eslint/bin/eslint.js
│   │   ├── eslint-config-prettier-check -> ../../../../node_modules/eslint-config-prettier/bin/cli.js
│   │   ├── lingui -> ../../../../node_modules/@lingui/cli/lingui.js
│   │   ├── lint-staged -> ../../../../node_modules/lint-staged/index.js
│   │   ├── webpack -> ../../../../node_modules/webpack/bin/webpack.js
│   │   ├── webpack-cli -> ../../../../node_modules/webpack-cli/bin/cli.js
│   │   └── webpack-dev-server -> ../../../../node_modules/webpack-dev-server/bin/webpack-dev-server.js
│   ├── .cache
│   ├── debug
│   ├── jsesc
│   ├── ms
│   └── source-map
├── package.json
├── src
└── webpack.config.js

我肯定漏掉了一些小东西，你能帮帮我吗？

Answer 1

我可能解决了这个问题，我注意到那些符号链接指向父目录。我必须将 dockerfile 移动到不同的目录并将更多文件复制到图像。如果成功，我会更新。

我在使用 Dockerfile 构建 React 应用程序和 webpack 时遇到问题

I have an issue with building react app and webpack using Dockerfile

webpack

dockerfile

yarnpkg