我有一个新网站,它不是单页面应用程序,而是服务器呈现网站(使用Umbraco CMS的asp.net).我曾经在我的网站上使用Angular 1.x,这很简单,因为你只需用脚本标签加载它,代码就是未编译的.

我最近在使用create-react-app启动的SPA中使用了React,它为你提供webpack,babel等服务并生成一个捆绑包.但是,我想在网站上的几个地方使用React,如主标题/菜单,联系表单等,因此生成多个包有意义,尽管这些包可能共享导入(Moment.js,Formik等).

React网站上有说明,说明如何包含单个脚本并将其附加到网站中的元素,但没有复杂的示例.

那么,我该如何设置一些能够在不重复捆绑代码的情况下转换所有内容的东西.我是否需要在所有页面和各个捆绑包上加载某种主捆绑包以用于联系表单等内容？

其次,我如何连接所有东西？在SPA中,您只有一个根节点,并使用react-dom将您的应用程序绑定到根节点,但如果您通过应用程序获得了一小部分反应功能,那么您是否需要某种主脚本来将所有内容绑定到正确的元素？

任何帮助都会非常感激,即使它只是指向某种样板项目的方向.

哦,我对服务器端渲染Next JS应用程序或类似的东西不感兴趣,我认为与CMS集成可能会变得太复杂.

最佳答案 如果你想在反应应用程序的根元素“外部”渲染元素,那么你可以使用
react Portals.我们也使用这种方法,并且进展顺利.

如果您仍然认为您需要在同一页面上运行多个迷你反应应用程序,则可以在ReactDOM.render的帮助下与它们进行通信.基本上,ReactDOM.render可以多次调用,它不会重新安装整个应用程序,而是触发更新并传播到反应树(与组件的正常渲染方法相同).

事实上,我写了一篇关于如何使用Integrate React with other applications and frameworks的教程的文章.

我还试图用codesandbox example来模拟这种方法

希望有所帮助.