Model manager is unable to render the aem content from .model.json response after creating a react build in AEM Remote SPA application
Hi,
We are trying to deploy AEM Remote React SPA which is using the Modal Manager asynchronously. Below is the code for initializing the modal manager:
import { createRoot } from 'react-dom/client';
import React from 'react';
import App from './App';
const { REACT_APP_PUBLIC_URI } = process.env;
import { ModelClient, ModelManager } from "@adobe/aem-spa-page-model-manager";
ModelManager.initializeAsync({
modelClient: new ModelClient('https://publish-url.adobeaemcloud.com'),
path: '/content/wknd-app/us/en/home.model.json'
});
const container = document.getElementById('root');
const root = createRoot(container);
root.render(<App />);
When trying to run locally, Modal manager is getting initialized successfully, also fetches the data from AEM and renders the AEM editable content "Hello World!" as expected (refer attachedscreenshot):
But when the react app is deployed, Modal manager gets initialized, fetches the data from AEM but does not render the AEM editable content "Hello World!"(refer attached screenshot of deployed react app):
We also tried executing react build locally with "serve -s build", and observed the same issue while running the local build. Any help on this is greatly appreciated.
