无法使用docker容器运行React应用 [英] can't run react app with docker container

问题描述

我有一个react-app，它简单地显示hello-world消息，但是我想通过docker-container运行该应用程序，但是有这个问题。此消息后，进程停止，没有运行应用程序。

I have a react-app, which simple showing hello-world message but I like to run the app throug docker-container but having this problem. After this message, process stopped without running app..

ℹ ｢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...

无法理解该怎么办，因为我在Dockerfile中有一个具有基本代码的非常小的应用程序

Can't understand what I should do because I have very small app with basic code in Dockerfile

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

我是否需要安装webpack-dev-server，我试过但是出现了版本错误，例如手动添加的服务器的版本低于已经存在的服务器。因此，我重新安装了webpack-dev-server。

Do I need to install webpack-dev-server, I tried but got version error like 'manually added server' has lower version than already server. so I re-install the webpack-dev-server.

我已经使用 create-react-app创建了应用，因此我认为每个依赖项都是自动管理的。
是谁有主意，我该如何解决这个问题..在此先感谢（BTW ..）

I have created app with 'create-react-app', so I think every dependency is managed automatically.. Is anyone have idea, how can I solve the problem.. thanks in advance (BTW..)

我用来构建的命令： docker build。 -t lucki

运行映像的命令： docker run -p 3000：3000 lucki

这是项目结构：

= *在Dockerfile中，我的响应为：

after adding DEBUG=* in Dockerfile, I have response as:

推荐答案

问题是，如果不是交互式终端，则开发模式将无法运行。

The problem is that the dev mode will not run if it is not an interactive terminal.

更改您的docker命令以包括交互式终端：

Change your docker command to include an interactive terminal:

将 -it 添加到您的 docker run 命令（ -i 交互式， -t 伪TTY），例如 docker run -it -p 3000：3000 your_container

Add -it to your docker run command (-i interactive, -t pseudo-TTY) e.g. docker run -it -p 3000:3000 your_container

npm start 是否在命令行上工作？

Does npm start work on the command line?

在容器中添加 DEBUG = * 作为环境变量。 DEBUG 是一个环境变量，用于控制许多节点模块的日志记录。

Add DEBUG=* as an environment variable inside your container.DEBUG is an environment variable which controls logging for many Node modules.

在您的 Dockerfile 中，添加

ENV DEBUG=*

或者在命令行中添加 -e'DEBUG = *'到您的 docker 命令。

Or on the command line, add -e 'DEBUG=*' to your docker command.

这可能有帮助发现错误消息，它们被吞没了

This may help spot error messages which are somehow getting swallowed

而不是运行 npm start ，直接运行文件。
例如在您的 Dockerfile

Instead of running npm start, run your file directly. e.g. in your Dockerfile,

CMD ["node", "index.js"]

尝试运行另一个Docker容器

如果这是您的docker的问题安装程序，运行一个已知的好的容器可能会帮助您发现它。

Try running another docker container

If this is a problem with your docker setup, running a known good container may help you discover it.

docker run --rm -it node:alpine

改进

您的 Dockerfile 也可以简化

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

• <$不需要c $ c> mkdir ，因为 WORKDIR 会自动创建目录。


• package * .json 还将复制 package-lock.json


• -production 将跳过安装 devDependencies


• 完整放入 COPY 命令最后将更好地利用缓存（除非您的依赖关系已更改，否则您无需重新运行 npm install ）
b
• mkdir is not needed, as WORKDIR automatically creates the directory.
• package*.json will also copy package-lock.json
• --production will skip installing devDependencies
• Putting full COPY command last will leverage cache better (you won't have to re-run npm install unless your dependencies have changed)

您可能还想使用 Tini 。 Tini转发信号，这意味着 docker stop 并在交互式终端中按Control + c实际上会立即停止节点进程。

You might also want to use Tini. Tini forwards signals, which means docker stop and pressing control+c in an interactive terminal will actually stop the node process immediately.

RUN apk add --no-cache tini
ENTRYPOINT ["tini", "--"]

这篇关于无法使用docker容器运行React应用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！