如何使用 Dockerfile.dev 和 Yarn 构建反应应用程序

Question

我正在尝试使用 docker 运行一个反应应用程序。以下是我的步骤：

我已经使用react-native-cli创建了一个反应应用程序并添加了Dockerfile.dev文件。我的 Dockerfile.dev 文件包含以下代码：

# Specify a base image
FROM node:alpine
WORKDIR '/app'
# Install some depenendencies
COPY package.json .
RUN yarn install
COPY . .
# Uses port which is used by the actual application
EXPOSE 3000
# Default command
CMD ["yarn", "run", "start"]

然后我执行此命令并获取此输出。但它没有显示任何端口来访问它。

docker build -f Dockerfile.dev .

OP：成功构建 ad79cd63eba3

docker run ad79cd63eba3

操作：

yarn run v1.22.4
$ react-scripts start
ℹ ｢wds｣: Project is running at http://172.17.0.2/
ℹ ｢wds｣: webpack output is served from
ℹ ｢wds｣: Content not from webpack is served from /app/public
ℹ ｢wds｣: 404s will fallback to /
Starting the development server...
Done in 2.02s.

谁能告诉我如何启动开发服务器，它向我显示了访问它的端口Http://localhost:3000。

完整代码：https://github.com/arif2009/frontend.git

Answer 1

Docker 和最新版本的 react 脚本存在问题。 这是一个关于它的Github线程：https://github.com/facebook/create-react-app/issues/8688

对于您的情况，(临时和最快的(解决方案是降级 package.json 文件中的 react-scripts 版本。 从：

"dependencies": {
...
"react-scripts": "3.4.1"
}

自：

"dependencies": {
...
"react-scripts": "3.4.0"
}

我使用此配置测试了您的项目，现在运行良好。

从上面的 Github 线程来看，它似乎是另一种带有 docker-compose 和stdin_open: true选项的解决方案(基本上对应于docker run命令的-it标志。如果 react-scripts 版本对您很重要，您也可以尝试这样做(并且您想保留它的最新版本(

Answer 2

这是针对 docker yarn react

# pull the base image
FROM node:lts-alpine
# set the working direction
WORKDIR /app
# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH
# install app dependencies
COPY package.json ./
COPY yarn.lock ./
# rebuild node-sass
RUN yarn add node-sass
RUN yarn
# add app
COPY . ./
# start app
CMD ["yarn", "start"]

Answer 3

# 指定基本映像 从节点：14.5.0 作为构建部门 # 创建工作目录并复制应用，然后运行纱线安装作为工件 # 凭据可以在 .npmrc 中 WORKDIR/usr/src/app 复制。./# 运行纱线安装 润纱安装 # 构建项目 CMD ["纱线"、"运行"、"构建"] # 为 yarn 包管理器安装 serve 命令 润纱全球加服务 # 导航到构建文件夹 WORKDIR/usr/src/app/build # 启动应用程序 CMD 服务 -p 80 -s .