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

我有一个节点服务器/ 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 会同时包含来自客户端和服务器版本的文件,因此我应该在此处进行某种“合并”。为了避免这种情况,我主要将服务器已知的静态文件放入staticcdn目录中。由于资产处理速度很慢,因此没有必要将所有内容放入客户端构建管道。

  • 部署目录已构建客户端和服务器 很好,因为我可以确切了解已部署的内容。但是,很难进行部分部署。如果仅更改服务器端代码,则也不需要重建和部署所有客户端,但是很难确切知道要清除的内容。

  • 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用于这样的不同路径。

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

a2207210 回答:构造.react应用程序全栈构建和部署的最佳方法是什么?

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/3054824.html

大家都在问