服务ReactDOM.使用Nginx渲染页面

4si2a6ki  于 2022-12-22  发布在  Nginx
关注(0)|答案(1)|浏览(142)

我有一个导出到ReactDOM.render()(index.js)的脚本(App.js),以便提供页面。我有一个Ubuntu服务器,运行Nginx作为反向代理,我想知道如何通过Nginx提供这个呈现的页面。
我当前的(简化)Nginx服务器配置(可用站点):

server {
        root path/to/build;

        server_name name www.name;

        location / {
                proxy_pass http://localhost:3000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }
     }

我用create-react-app和npm run build + serve -s build运行这个程序,但是我不确定这是否是我应该使用的方法。
我的索引.js:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

我的目标是让我的单一网页通过我的网址;目前,它显示的只是一个空页面。2我认为这是因为它提供的是空的build.HTML文件。

g52tjvyc

g52tjvyc1#

通过NGINX运行前端应用程序的通常方法是通过运行npm run build将其构建/绑定到distbuild文件夹。此文件夹将由nginx使用,它包含htmlcssjs文件。如果您将nginx.conf中的root设置为构建时的文件夹,或者将内容移动到nginx.conf所指的位置,您将看到这意味着您也可以删除server {中的当前配置

相关问题