When deciding what level of integration you would like to have between your external SPA and AEM, it is often clear that you need to be able to view and edit the SPA within AEM. The RemotePage Component is a custom page component just for this purpose.
The RemotePage component fetches all the necessary assets from the application’s generated asset-manifest.json
and uses this for rendering the SPA within AEM.
See the article Editing an External SPA within AEM for more details on editable, external SPAs in AEM.
asset-manifest.json
file at the domain root that lists in an entrypoints property
all CSS and JS files that are to be loaded:
<div id="root"></div>
underneath the body
element. If a different markup is expected for the app to instantiate, then this must be adjusted accordingly in the HTL scripts of the proxy component that has a sling:resourceSuperType="spa-project-core/components/remotepage
.Like the rest of the AEM SPA project, the RemotePage Component is open source. For the full technical details of the RemotePage Component, please see the GitHub repository.