create-react-app + docker = QA和PROD Deploy

Question

我正在使用create-react-app为我的项目使用docker作为我的开发环境。

现在我想知道将项目部署到AWS的最佳实践（我将部署docker）。

也许我的问题是假的，但我真的坚持了。

我的docker文件有一个命令纱线启动...对于开发它就足够我不需要构建任何东西，我的包将在内存中运行，但对于QA或PROD我想使用npm运行构建但是据我所知，它将创建一个新文件夹，其中包含应该在prod env上使用的文件。

那就是说，我的问题是：这种情况的最佳做法是什么？

感谢。

Answer 1

这就是我所做的：

1. 使用npm run build构建所有静态文件。
2. 使用_/nginx图像自定义提供这些静态文件的HTTP服务器。 （Dockerfile）
3. 将自定义图像上传到Amazon EC2容器服务（ECS）。
4. 在ECS任务中加载图像。然后使用ELBv2启动负载平衡服务器以将所有外部请求转发给ECS。
5. （可选）在ELBv2中启用HTTPS。

一次性事情：

1. 弄清楚ECS的机制。您需要为ECS创建至少一个主机服务器。我使用了Amazon ECS-Optimized AMI。
2. 在ECS上创建一个Docker存储库，以便您上传自定义的Docker镜像。
3. 为您的服务创建ECS任务定义。
4. 创建ECS群集并添加任务。
5. 配置ELBv2，以便将流量转发到内部ECS动态端口。
6. （可选）编写脚本以自动化日常部署。
如果有人要我为她/他做那些事，我会得到报酬。或者你可以自己解决这些线索。

但是，如果您的网站是一个简单的静态网站，我建议使用Github pages：它是免费且简单的。我的解决方案适用于多个静态+动态应用程序，这些应用程序可能涉及其他服务（例如Redis，ElasticSearch）以及每日/每小时所需的部署。

Answer 2

您必须运行npm run build，然后将生成的文件复制到容器中。您可以使用单独的Dockerfile.build来构建文件，提取它们并将它们添加到最终容器中。您的最终容器应该能够提供文件。您可以将其基于nginx或其他服务器。您也可以将其用作data volume container in your existing server container。

最新版本的Docker允许您组合两个Dockerfiles，从而使此过程更容易。您可以拥有一个构建容器，然后在同一个文件中定义最终容器。

以下是您的用例的简单示例：

FROM node:onbuild AS builder
RUN npm run build

FROM nginx:latest
COPY --from=builder /usr/src/app/build /usr/share/nginx/html

您可能希望包含自己的nginx配置文件。

有关多阶段构建的更多信息：

https://docs.docker.com/engine/userguide/eng-image/multistage-build/