如何将我的 ReactJS Web 应用程序部署到生产服务器答案

【问题标题】：How to deploy my ReactJS web application to Production Server如何将我的 ReactJS Web 应用程序部署到生产服务器
【发布时间】：2019-10-23 04:32:22
【问题描述】：

我的项目是用 [ReactJS + php + mysql] 创建的。我已经设置了我的本地环境，例如npm install、npm start，这很好，我的网站在我的本地 PC localhost:1234 中运行良好。之后，我想将我的 ReactJS Web 应用程序部署到生产环境中，为此我有一个 Digitalocean 的 Ubuntu 18.04 服务器。因此，我安装了 Nginx Web 服务器并让加密的 SSl 我有一个 DNS xplosa.com，这一切都已完成，目前指向 nginx 主页。

我已经尝试过npm build，这太完美了，没有错误我可以在我的项目中看到一个名为 dist 的目录，它的部署源是一堆杂乱无章的文件，无论如何我只是复制我的 dist contains(在我的本地电脑中）使用 SFTP 方法传输到我的 Nginx 指向目录（我的 digitalocean 的 ubuntu 服务器），但是在我重新启动我的 nginx 并使用 www.xplosa.com 在互联网上检查我的网站后，它只显示我的网站欢迎消息。之后，我从中删除了我的源代码，并保留了它的欢迎页面，回到我的本地电脑并检查它在我的本地机器上是否有效。请帮助我在生产环境中部署我的 ReactJS Web 应用程序

【问题讨论】：

标签： php reactjs nginx deployment ubuntu-18.04

【解决方案1】：

首先在生产环境中部署和构建您的 React 应用程序。
并配置 Nginx 以将应用程序作为静态服务器：

server {
  listen   80;
  server_name www.xplosa.com xplosa.com;

  rewrite ^(/.*)\.html(\?.*)?$ $1$2 permanent;
  rewrite ^/(.*)/$ /$1 permanent;

  root /home/ubuntu/www/your-path/;
  index index.html;
  try_files $uri/index.html $uri.html $uri/  /home/ubuntu/www/your-path/index.html /home/ubuntu/www/your-path/$uri.html  $uri =404;

}

注意：如果请求的资源不存在，上述配置将为索引页面提供服务，因此它将很好地满足您的目的。并且你必须用 Nginx 来处理 Php 端

【讨论】：

我应该在我的生产服务器上安装 npm , php 以在直播@Eslam Abu Hugair 上执行我的网站
是的，必须安装 npm 才能构建应用程序
我也需要提供我的 php 文件，我该怎么做
您可以使用 apache 代替 Nginx 来服务器 PHP 和您的 react 应用程序静态文件，或者您可以将两者结合起来（apache 来服务 PHP）和 Nginx 作为负载均衡器

【解决方案2】：

您可以使用更新 ip 表并将流量从 80 端口重定向到生产服务器中的 1234 端口来执行此操作。

您可以使用 pm2 命令将端口注册为始终在生产服务器中运行，然后使用 ip table 可以重定向端口。

另一种选择是将构建文件夹的路径和配置文件（apache2 或 nginx）中的路径提供给服务器。

【讨论】：