Question

我正在尝试使用create-react-app App运行docker容器。 App运行正常，这是我的dockerfile的样子。

# base image
FROM node:12.2.0-alpine

# set working directory
WORKDIR ./

# add `//node_modules/.bin` to $PATH
ENV PATH ./node_modules/.bin:$PATH

# install and cache  dependencies
COPY package.json ./package.json
COPY ./build/* ./public/
RUN npm install --silent
RUN npm install react-scripts@3.0.1 -g 

# start 
CMD ["npm", "start"]

当我运行docker im时报错

> my-app@0.1.0 start /
> react-scripts start

Could not find a required file.
  Name: index.js
  Searched in: /src
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! my-app@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the my-app@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2019-07-14T08_29_30_761Z-debug.log

有人有什么主意吗？

Answer 1

npm start用于webpack-它充当开发服务器。您仍在直接使用src文件，而不是仅用于生产环境的小型build（dist）。

#Dockerfile.dev:

# base image
FROM node:12.2.0-alpine

# set working directory
WORKDIR ./

# add `//node_modules/.bin` to $PATH
ENV PATH ./node_modules/.bin:$PATH

COPY package.json ./package.json

#use the minified build file for production, not now - npm start is for development.
#COPY ./build/* ./public/ 

#install dependencies:
RUN npm install --silent
RUN npm install react-scripts@3.0.1 -g 

#copy your project files: (also bad for development, use volume(https://docs.docker.com/storage/volumes/) instead)
COPY . . 

# start 
CMD ["npm", "start"]

Answer 2

（这是基于@EfratLevitan的答案，但更注重生产。如果您想将Docker用作开发流程的核心部分，他们的答案会更好。）

如果您已经具有有效的Webpack设置，则其输出是可以由任何Web服务器提供服务的静态文件。成功运行npm run build后，您就可以使用任何东西来服务生成的build目录–将其作为Flask应用程序之类的静态内容，将其放入Amazon S3这样的云服务中为您服务，直接自己托管。 CRA Deployment page中描述的任何技术都可以与基于Docker的后端配合使用。

如果您想通过Docker自己提供服务，则不需要Node服务build目录，因此像nginx这样的普通Web服务器将可以正常工作。图片说明中的两个示例在这里为您工作：

# Just use the image and inject the content as data
docker run -v $PWD/build:/usr/share/nginx/html -p 80:80 nginx

# Build an image with the content "baked in"
cat >Dockerfile <<EOF
FROM nginx
COPY ./build /usr/share/nginx/html
EOF

# Run it
docker build -t me/nginx .
docker run -p 80:80 me/nginx

等效于所有Docker的方法是使用multi-stage build在Docker内部运行Webpack构建，然后将其复制到生产Web服务器映像中。

FROM node:12.2.0-alpine AS build
WORKDIR /app
COPY package.json yarn.lock .
RUN npm install --silent
RUN npm install react-scripts@3.0.1 -g 
COPY . .
RUN npm run build

FROM nginx
COPY --from=build /app/build /usr/share/nginx/html

在此模型中，您将在本地开发前端代码。（Webpack / CRA堆栈具有很少的主机依赖性，并且由于该应用程序在用户的浏览器中运行，因此它不能依赖于Docker特定的网络功能。）仅当您要运行最终的Docker文件时，才构建此Dockerfile。在实际投入生产之前，将所有零件一起运行进行最终测试。

找不到所需的文件

2 个答案: