Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn more

View all

Sign in to view all badges

SOLVED

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

gajanank2729265
Level 2
Level 2

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!!!

 

 

1 Accepted Solution
Vijayalakshmi_S
Correct answer by
Community Advisor
Community Advisor

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. 

 

View solution in original post

2 Replies
Vijayalakshmi_S
Correct answer by
Community Advisor
Community Advisor

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. 

 

View solution in original post

Arun_Patidar
Community Advisor
Community Advisor

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.