如何从客户端进行交互（将React附加到）预渲染的React应用？

Question

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

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

然后我进行了构建：

  npm run build

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

这很好，但不是交互式的，所以我想我必须以某种方式附加React并从客户端调用hydr（）。 （对吗？hydrat（）是否也可以从客户端使用？）

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

这是正常调用渲染的方式：

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

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

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

Answer 1

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

根本不需要调用hydrate（），一切都按原样工作。问题是在index.html中使用路径/static/...

引用了生成的.js和.css文件。

修复了可立即使用的路径后，生成的应用程序将是交互式的，按下按钮后将显示警报对话框。