AEM react component reflecting in react app but not reflecting in AEM server | Community
Skip to main content
Level 2
May 6, 2021
Solved

AEM react component reflecting in react app but not reflecting in AEM server

  • May 6, 2021
  • 2 replies
  • 2328 views

Hi All,

 

I am trying to create the first react component in my local and did the set up as per the weekend tutorial available.

When first time I run the app, all the changes were coming fine on the aem as well as react app (localhost:4502 and localhost:3000). When i created the new component in react and mapped it to newly created component in ui apps, and deployed the same in my local, I can see the component in react app but same component is not coming up in aem.

 

I have created aem component in ui apps with basic dialog fields.

I have created the sling model and exported the same using Jackson exporter

I have created the react component and mapped the same to aem component.

I have added the component mapping in import-components.js

I have deployed the code in my local instance

 

As soon as deployment is completed, I am able to see new component in the side rail. but when I am dragging and dropping the component on page, I am not seeing the component in aem page.

 

If I check the json at http://localhost:4502/content/reactproject/en.model.json, I can see my component.

when I check the react page http://localhost:3000/content/reactproject/en/home.html I can see the component here also. but only at http://localhost:4502/content/reactproject/en/home.html I am not able to see my component.

 

Has anyone faced this issue ? kindly let me know if I am missing any step here.

 

One thing I observed here is when I do the rebuild clientlib, my changes get reflected. But I need to do this every single time when I created a new component. Is there any other work around ?

 

Thanks in advance!!!

 

 

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

Hi @gajanank2729265,

Could you please let know if your new component changes reflects in clientlib-react.js(Entire react side changes are compiled and available via this JS and added to spa project specific clientlib) when accessing from author/editor mode instance(Suggest to check the file from being in Network -> Filter request by JS -> access that file in new browser tab) before you could trigger rebuild clientlibs. 

 

2 replies

Vijayalakshmi_S
Vijayalakshmi_SAccepted solution
Level 10
May 6, 2021

Hi @gajanank2729265,

Could you please let know if your new component changes reflects in clientlib-react.js(Entire react side changes are compiled and available via this JS and added to spa project specific clientlib) when accessing from author/editor mode instance(Suggest to check the file from being in Network -> Filter request by JS -> access that file in new browser tab) before you could trigger rebuild clientlibs. 

 

arunpatidar
Community Advisor
Community Advisor
May 7, 2021

Hi,

The issue could be with cache, try disabling browser cache.

I have recently built the react components and never seen this issue, worked locally as well as on AEM Author.

Arun Patidar