Can I mix HTL and SPA components in page? | Community
Skip to main content
Anudeep_Garnepudi
Community Advisor
Anudeep_GarnepudiCommunity Advisor
Community Advisor
December 4, 2020

Can I mix HTL and SPA components in page?

  • December 4, 2020
  • 3 replies
  • 2219 views

Hello Guys,

Is there any way to mix HTL and SPA components in a page (SPA or non SPA template)? Chris Millar at adaptTo conference 2018 said that it is not possible yet. Is there way now? Any Ideas? Thanks.

-AG

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

Vaibhavi_J
Vaibhavi_J
Level 7
December 4, 2020

Hi @anudeep_garnepudi , 

 

Please check out the below thread. Solution is discussed in detail. 

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/using-general-htl-components-in-an-aem-spa-react/qaq-p/376107

    kautuk_sahni
    Community Manager
    kautuk_sahniCommunity Manager
    Community Manager
    December 4, 2020

    See the reply from @nikhil-kumar 

     

     

    If you want to create any component using SPA template then it's not possible.
    But you can have your own template created and and create HTL component in the same project structure.

    NOTE: You can not use non SPA component in SPA template. As in SPA everything is client-side rendered.
    If you see the body.html we only have root div to render at react side.

    You can check out my article on the same, soon I will be coming up with one article in which I will list down the issues that I faced during my AEM+SPA project experience.

    Kautuk Sahni
    Anudeep_Garnepudi
    Community Advisor
    Anudeep_GarnepudiCommunity AdvisorAuthor
    Community Advisor
    December 4, 2020

    @vaibhavi_j , @kautuk_sahni 

    Thanks for quick reply. My case is like 2 custom components on page

    1. First/top component only uses HTL as view, no react
    2. Second/bottom component only uses react as view and no HTL

    Idea is like the components that are always on top of page will develop using HTL and components which are always used down the page will develop using React.

    AG
      Nikhil-Kumar
      Community Advisor
      Nikhil-KumarCommunity Advisor
      Community Advisor
      December 9, 2020

      @anudeep_garnepudi - As far as I know it's not possible to mix a Non SPA and SPA component in SPA page.
      But you can try adding adding some text or something at the page template level (Which will be hardcoded not a draggable component), But this will be effective across the template.

        Terms & ConditionsAccessibility statement

        Loading footer...