Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

When you create AEM project Using Maven Archetype and use "frontendModule=react", Custom components doesn't render.

Avatar

Level 2

The similar problem has been mentioned before in this forum but I guess theres no solution found yet.

 

Solved: SPA React not displaying Custom Components - Adobe Experience League Community - 326448

 

Anyone knows what is happening here and how to fix it?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Can you explain what you consider a "Custom" component?

There is often a lack of understanding regarding what gets rendered in the AEM SPA Editor. My recommendation is to carefully read this article that delves into how the AEM SPA Editor works: https://experienceleague.adobe.com/docs/experience-manager-65/developing/spas/spa-overview.html?lang....

This article provides clear details on how components work and render within the SPA Editor. That being said, if your "custom" components do not meet these conditions, it won't render. That was clearly the issue in the thread you have pointed out.

I have used many custom components in the SPA Editor, and they work well when following the guidelines provided in the documentation, as outlined in this link: https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/s....

 

Hope this helps.



Esteban Bustamante

View solution in original post

3 Replies

Avatar

Community Advisor

@Anuj31005349h74z I believe for your SPA project you need to use SPA components, Normal AEM components would not render OOTB with the archteype.

https://experienceleague.adobe.com/docs/experience-manager-65/developing/spas/spa-overview.html?lang...

 

Avatar

Community Advisor

Hi @Anuj31005349h74z,

As correctly pointed out by @Manu_Mathew_, you should create a custom component using the SPA editor framework. Here are the steps outlining how to create a custom component that is compatible with the SPA editor framework.

https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/s... 

Avatar

Correct answer by
Community Advisor

Can you explain what you consider a "Custom" component?

There is often a lack of understanding regarding what gets rendered in the AEM SPA Editor. My recommendation is to carefully read this article that delves into how the AEM SPA Editor works: https://experienceleague.adobe.com/docs/experience-manager-65/developing/spas/spa-overview.html?lang....

This article provides clear details on how components work and render within the SPA Editor. That being said, if your "custom" components do not meet these conditions, it won't render. That was clearly the issue in the thread you have pointed out.

I have used many custom components in the SPA Editor, and they work well when following the guidelines provided in the documentation, as outlined in this link: https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/s....

 

Hope this helps.



Esteban Bustamante