如何为预渲染 React App 配置 nginx？

Question

我有 React 应用程序。

它在本地机器上运行良好（app + prerender-spa-plugin）。我运行它用命令 http-server 进入 ./build package

但是服务器上出了问题 - 它就像我用 serve-s 命令启动它一样。

服务器上有 docker 个 nginx 映像。

我尝试重新配置 nginx，使其对不同的 URL 使用不同的 index.html，但再次失败

路由到保存静态图像的目录有问题吗？

如何解决？或者我在哪里可以找到相关信息？

Answer 1

您必须在 nginx 服务器上创建虚拟主机并将其指向应用程序的构建文件夹。别忘了运行 npm run build.

简单的 nginx 配置

server {

    listen 80;
    listen [::]:80;

    root /var/www/reactjsapp/build;
    index index.html index.htm;

    server_name reactjsapp.com;

    location / {
        try_files $uri /index.html;
    }

        location ~ /\.ht {
            deny all;
        }

}

Answer 2

我决定了。我的配置

location / {
            root   /usr/share/nginx/html;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }

来自官方文档："It is possible to check directory’s existence by specifying a slash at the end of a name, e.g. “$uri/”."

https://i.stack.imgur.com/PusBE.png

如何为预渲染 React App 配置 nginx？

How configure nginx for prerender React App?

nginx

prerender

reactjs