无法弄清楚为啥 docker compose up 没有运行我的 React JS 应用程序

Posted 2023-02-26

【中文标题】无法弄清楚为啥 docker compose up 没有运行我的 React JS 应用程序

【英文标题】：Not able to figure out why docker compose up is not running my React JS App无法弄清楚为什么 docker compose up 没有运行我的 React JS 应用程序

【发布时间】：2020-09-22 12:54:01

【问题描述】：

我想借助 docker-compose 和 docker 文件在 docker 容器中运行 react 应用程序。它显示 package.json 文件丢失，但我的本地目录中确实有该文件，我正在尝试与 docker 容器进行映射。

我已经通过运行docker-compose build 命令成功构建了镜像。但是当我尝试运行docker-compose up 命令时，它显示以下错误

PS E:\Project\MyProfile\my-profile> docker-compose up   
Starting myprofile_web_1 ... done
Attaching to myprofile_web_1
web_1  | npm ERR! code ENOENT
web_1  | npm ERR! syscall open
web_1  | npm ERR! path /app/package.json
web_1  | npm ERR! errno -2
web_1  | npm ERR! enoent ENOENT: no such file or directory, open '/app/package.json'
web_1  | npm ERR! enoent This is related to npm not being able to find a file.
web_1  | npm ERR! enoent
web_1  |
web_1  | npm ERR! A complete log of this run can be found in:
web_1  | npm ERR!     /root/.npm/_logs/2020-06-03T16_54_28_610Z-debug.log
myprofile_web_1 exited with code 254 

我的机器是 Windows 10，如果大家需要任何进一步的信息，请告诉我。

我的 Docker 文件：

FROM node:alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
CMD [ "npm","run","start" ]

Docker 编写文件：

version: '3'
services: 
    web:
        build:
            context: .
            dockerfile: Dockerfile.dev
        ports: 
            - 3000:3000
        volumes: 
            - /app/node_modules
            - .:/app

更新 1：

正如彼得建议的那样，我查看 Docker 容器中的“app”目录，我可以在那里看到 package.json 文件。

更新 2

文件权限日志

PS E:\Project\MyProfile\my-profile> docker run website ls -lah
total 724K
drwxr-xr-x    1 root     root        4.0K Jun  6 16:03 .
drwxr-xr-x    1 root     root        4.0K Jun  6 16:07 ..
-rwxr-xr-x    1 root     root          17 Jun  5 16:55 .dockerignore
drwxr-xr-x    7 root     root        4.0K Apr 20 16:02 .git
-rwxr-xr-x    1 root     root         310 Oct 26  1985 .gitignore
drwxr-xr-x    2 root     root        4.0K Apr 18 10:53 .vscode
-rwxr-xr-x    1 root     root         190 Jun  4 18:08 Dockerfile.dev
-rwxr-xr-x    1 root     root       52.6K Sep 21  2019 MyProfile.png
-rwxr-xr-x    1 root     root        2.8K Oct 26  1985 README.md
drwxr-xr-x    3 root     root        4.0K Apr 16 17:34 build
drwxr-xr-x    3 root     root        4.0K Oct  2  2019 config
-rwxr-xr-x    1 root     root         274 Jun  4 17:54 docker-compose.yml
-rwxr-xr-x    1 root     root         610 Apr 24 05:11 eg.js
drwxr-xr-x 1056 root     root       36.0K Jun  6 15:59 node_modules
-rw-r--r--    1 root     root      562.9K Jun  6 15:59 package-lock.json
-rwxr-xr-x    1 root     root        3.8K Apr  5 08:34 package.json
drwxr-xr-x    2 root     root        4.0K Apr 20 05:03 public
drwxr-xr-x    2 root     root        4.0K Oct  2  2019 scripts
drwxr-xr-x    6 root     root        4.0K Apr 15 16:44 src

解决方案：

我可以通过将我的项目移动到 C:/User/User_Name 文件夹来解决此问题。可以在此处找到相同的解释（Docker volumes and package.json not found）

如果你不想像我一样移动文件夹，你也可以这样做，看看这个 (How to mount local volumes in docker machine)

【问题讨论】：

能否请您更新完整的 docker-compose 和 dockerfile，如果可能的话项目结构。

或者你能做什么，将代码推送到github公共仓库并使用链接

是时候加速射击了！在 bash 中打开容器 -> 转到 package.json 所在的目录并运行 npm install 看看你有没有权利，我们有权利问题。

你能不能先试一试如果你已经有package-lock.json文件，删除它然后再试一次。您的屏幕截图中有。

【参考方案1】：

要做的步骤：

1. 如果已缓存，请执行此操作（它将删除您的 docker 卷）：

 docker-compose down -v --rmi "all"

然后再次“docker-compose up”。

2.您可能遇到的另一个问题是文件的权限。

什么用户拥有文件“package.json”？

还要确保在您拥有此文件夹的同一文件夹中运行“docker-compose up”或在 COPY 语句中正确指向此文件夹（“COPY package*.json ./”）

用途：

docker exec  <name of container> ls -lah

<name of container> 是您的姓名或容器 ID。如果你写下命令“docker ps”，你可以看到这个，它会显示一个像下面这样的列表，上面有这个标题，如果不是空的，下面是活动的容器

CONTAINER ID | IMAGE | COMMAND | CREATED | STATUS | PORTS | NAMES

查看您的 package.json 不存在或该文件的权限不正确。请记住“docker run”从特定图像创建容器。 "docker exec" 使用已经存在的容器执行命令。

印制你的“ls”文件夹“ls -lah”会更有帮助。

3. 您的 docker-compose 首先排除 node_modules 然后挂载您的根根目录（node_modules 所在的位置）尝试如下（切换顺序）：

     volumes: 
        - .:/app
        - /app/node_modules

【讨论】：

尝试在命令下运行，但也遇到了一些问题 docker-compose down -v --rmi 'all' ``` PS E:\Project\MyProfile\my-profile> docker-compose down -v --rmi 'all ' 删除网络 myprofile_default 警告：找不到网络 myprofile_default。删除图像 myprofile_web 错误：无法删除服务 web 的图像：409 客户端错误：冲突（“冲突：无法删除存储库引用“myprofile_web”（必须强制）-容器 9c10fa123439 正在使用其引用的图像 07d1f74228f1”）```跨度>

这告诉你你已经删除了默认网络，出于任何原因已经删除了该网络。无论如何，您唯一需要的就是删除卷。 “docker-compose down -v”然后“docker-compose up”应该足以重新创建卷。如果问题仍然存在，那么可能是权限。让我知道发生什么事。还要检查更新我的答案。

也可以尝试第 3 步，让我知道您的结果

嗨@MikZuit，您能否解释一下第2 步中的 是什么。如果您能提供更多详细信息，将会很有帮助。我在 package.json 文件所在的终端上运行了 docker-compose

感谢您更新答案。我如何获取容器 ID，因为 docker container ls 显示没有容器正在运行。我认为这是有道理的，因为 docker-compose up 抛出错误，它不会运行并强制退出

【参考方案2】：

我可以通过将我的项目移动到 C:/User/User_Name 文件夹来解决此问题。可以在此处找到相同的解释 (Docker volumes and package.json not found)。

如果你不想像我一样移动文件夹，你也可以这样做，看看这个 (How to mount local volumes in docker machine)

【参考方案3】：

像这样改变你的复制行

COPY package*.json .

【参考方案4】：

您好，欢迎来到 Stack Overflow

您的COPY package*.json ./ 行正在将您的package.json 复制到一个名为./ 的文件中

如果您要使用自定义入口点运行容器，如下所示，您会看到一个相应命名的文件。

您可以执行以下操作来获得一个交互式 shell，它允许您检查文件系统：

docker run -it --entrypoint /bin/sh your-image-name

【讨论】：

谢谢彼得，但我可以看到 package.json 存在于 'app' 目录中

@HeetShah 您能否尝试从您的 dockerfile 中删除 CMD，然后重新构建并重新运行 compose。然后执行 docker exec -it containerid /bin/sh，将 containerid 替换为来自 docker ps 的 id。然后执行 ls -alh 以确认文件系统中的内容

我在我的 docker 文件中注释了 CMD 之后我应该运行docker-compose build吗？

是的，应该启动并运行它，这样你就可以执行 :)

嗨彼得，感谢您的快速回复，我重新运行 compose 文件，但在执行 docker container ls 命令时看不到容器 ID

【参考方案5】：

我有另一种方法来实现这一点。在这种方法中，您必须在容器外构建您的反应应用程序并将构建传递给容器。

使用 Ngnix 启动 UI 应用程序

docker-compose.yml

version: "3"
services:
  uiApp:
    build:
      context: .
    image: uiApp:latest
    container_name: uiApp
    volumes:
      - [ path of ui app build ]:/usr/share/nginx/html
      - ./conf:/etc/nginx/conf.d/ #map conf dir in project to ngnix container conf.d
    ports:
      - 80:80

码头文件

FROM nginx
LABEL APP_ID="ui-App"
RUN rm /etc/nginx/conf.d/default.conf
CMD ["nginx", "-g", "daemon off;"]

ngnix.conf

位置：./conf/ngnix.conf

server     
    listen 80;  
    server_name host.docker.internal;   

    location /     
            root   /usr/share/nginx/html;   
            index  index.html index.htm;    
           

我知道这不是您想要的方法，但这是使用 Ngnix 启动 UI 应用程序的另一种解决方法

【讨论】：

实际上，以他们当前拥有的方式将构建保留在 docker 构建中，而不是依赖外部工具，这是一个很好的做法。任何人都允许您下载代码并快速运行它

【参考方案6】：

您正在构建 React App 内的另一种方法 docker container

码头文件

FROM node:10
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD [ "npm", "start" ]

docker-compose.yml

version: '3'
services:
  uiApp:
    build:
      context: .
    ports:
      - 4680:3000
    command: npm start

构建和运行容器的命令

docker-compose build uiApp
docker-compose up uiApp

【参考方案7】：

我研究你的问题是

web_1 | npm ERR! enoent ENOENT: no such file or directory

根据我在 GitHub 线程和 *** 上找到的答案，例如 https://***.com/a/52222749/5108695

如果您已经有 package-lock.json 文件，只需将其删除并重试。

所以请运行exec docker 容器和rm（删除）package-lock.json。然后尝试运行你的 npm 任务

当您的 docker-compose 将所有内容从 . 位置复制到容器的 app 目录时，问题就出现了。

所以你可以做什么，每次容器启动时删除package-lock.json，这不是一个好习惯?

.dockerignore的使用

放置在 docker-compose 和 dockerfile 所在的同一位置。

---

.dockerignore

#add your file which you want to ignore while docker processing
package-lock.json

尝试这些步骤，您的问题将得到解决。

有任何疑问请评论