Question

我有一个节点服务器/ React Client应用程序，想知道为部署构造布局的最佳方法是什么？

我目前使用： -打字稿：服务器也有一个/src目录。 -裸机节点服务器而不是heroku / zeit PaaS -Nginx提供静态文件 -Webpack开发代理 -rsync将文件推送到服务器 -pm2用于流程管理

我的仓库中有顶级目录布局，例如：

server
  /src
  /public  # for static files
  /cdn     # setup
client/
  src/
  public/  # build images thru webpack pipeline

deploy/    # build everything here

现在，我将所有内容构建到/deploy目录中，然后使用rsync将其全部推送到我的服务器上。

deploy
  public/  # 
  node_modules  # from server
  server.js

但这有一些问题，并且比预期的要慢。

public 会同时包含来自客户端和服务器版本的文件，因此我应该在此处进行某种“合并”。为了避免这种情况，我主要将服务器已知的静态文件放入static或cdn目录中。由于资产处理速度很慢，因此没有必要将所有内容放入客户端构建管道。
部署目录已构建客户端和服务器很好，因为我可以确切了解已部署的内容。但是，很难进行部分部署。如果仅更改服务器端代码，则也不需要重建和部署所有客户端，但是很难确切知道要清除的内容。
create-react-app 始终会构建为./build，因此我必须移动/重命名某处以便为其提供服务。我不能只部署我的客户目录。它还会为所有固定资产创建一个/static文件夹，该文件夹应托管在服务器根目录下，因此需要避免在服务器端使用任何称为/static的东西。

那么别人在做什么？

构建以分隔目标目录

我正在考虑仅在“就地”客户端和服务器上构建/编译，然后使用rsync --exclude /src /xyz过滤所需的文件。然后使用nginx服务器端映射要服务的路径。例如build

nginx

另一个问题是如何设置Nginx配置对于应用程序的/，我通常要转到节点应用程序

    location / {
        proxy_pass http://localhost:3900;

但是我想可能需要more like this

server {
  listen 8081;
  server_name example.com;
  location / {
    root /path/to/website/public;
    index index.html;
    try_files $uri $uri/ @express; # instead of 404, proxy back to express using a named location block;
    # source: https://stackoverflow.com/a/15467555/8436941
  }
  location @express {
    proxy_pass http://localhost:8080;
  }
}

另一种方法是采用类似的结构：

/deploy
  /server
  /client

，然后使用nginx映射路径。用于构建目的的清理器，但不确定是否应将try_files用于这样的不同路径。

正在寻找干净快捷的建议！

构造.react应用程序全栈构建和部署的最佳方法是什么？

构建以分隔目标目录

nginx

0 个答案: