是否可以在服务器端 Express Route 中为客户端 React 组件/应用程序提供服务？

Question

我有一个 Node/Express 后端，它使用 Pug.js 呈现许多服务器端路由。该应用程序目前是静态的，是一个简单的站点。

我使用 CRA 在 React.js 中创建了一个交互式 "builder" 组件。它允许站点访问者以交互方式配置产品。最终目标是这样的：

当网站访问者点击构建器导航 link 时，他们将被带到一个页面，该页面将呈现我的服务器端模板以保持网站的外观和感觉。但是，在内容块中，我想呈现我创建的反应应用程序。

我已经找了好几天了，也许我只是不明白我是什么人 seeing.I 不确定服务器端渲染或代理是否能让这项工作成功？我试过CRA proxy，还没有得到结果。

文件夹结构图片：

如果有人需要更多信息或可以指出一些资源，那将非常有帮助。

我还在学习，所以如果这违反了任何 SO 准则，我深表歉意。

提前致谢

Answer 1

所以，您的 CRA 看起来像

  import React from 'react';
    import ReactDOM  from 'react-dom';

    ReactDOM.render(
        <h1>Hello, world!</h1>,
        document.getElementById('app')
    );

因此，要公开此组件，您应该有一个与所有其他模板一样的哈巴狗模板，只是还包含其中的某处

<div id="app"></div>
<script src="bundle.js"></script>

其中脚本的 src 是您构建的组件的相对路径。然后，当他们到达该路线时，只需使用 express 为该模板提供服务。

是否可以在服务器端 Express Route 中为客户端 React 组件/应用程序提供服务？

Is it Possible to serve a Client Side React Component / Application in a server side Express Route?

javascript

express

reactjs

pug

create-react-app