如何从客户端进行交互式（附加React）预呈现的React应用程序？

Question

我想向客户端显示预呈现的交互式应用程序（服务器只发送html）。

我为测试创建了一个简单的反应应用程序，只有一个按下按钮时显示一个警告对话框。

然后我做了一个构建：

  npm run build

这在build目录中创建了一个index.html文件，该文件在打开时显示测试应用程序。

这很好，但不是交互式的，所以我想我必须以某种方式将React附加到它并从客户端调用hydrate（）。 （这是正确的吗？hydrate（）也可以从客户端工作吗？）

问题是我不知道应该如何调用hydrate（）。

这是正常调用render的方式：

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

但是我不能在客户端使用hydrate（），因为客户端JS不知道<App />语法。所以我的问题是如何在浏览器中调用hydrate（），我应该为第一个参数而不是<App />添加什么？

ReactDOM.hydrate(<App />, document.getElementById('root'));

Answer 1

找到解决方案并留给其他人作为答案。

根本不需要调用hydrate（），一切都按原样运行。问题是生成的.js和.css文件在index.html中引用了路径/static/...

修复它立即工作的路径后，生成的应用程序是交互式的，按下按钮时会显示警告对话框。