ui-frontend module not able sync using "vscode aem sync" extension or mvn command

[varaande]

Hi Team

I am not able sync changes of ui-frontend module either using vscode aem sync extension or mvn command. Please let me know how to sync. ui-frontend module changes to do the unit testing or debugging as part of frontend module changes. 

1) Using VS Code AEM Sync, I  am able to sync changes ui-apps but not ui-frontend module changes.

https://marketplace.visualstudio.com/items?itemName=yamato-ltd.vscode-aem-sync

2) Using below mvn command able see the changes to ui-apps but not able deploy directly changes to AEM Server unless deploy ui-apps modules (first build the frontend module then deploy the ui-apps module)
frontend module: mvn clean install -PautoInstallPackage  (can I use mvn clean install also because we are not able to deploy the changes to aem server)
then 
ui-apps module :mvn clean install -PautoInstallPackage

Regards

Vara

[EstebanBustamante]

Hi,

I would recommend using the static server that comes with webpack as part of the AEM archetype. This will enable you to experience 'hot reload,' thereby avoiding the need to deploy your code multiple times on your AEM server. The process is straightforward: navigate to your ui.frontEnd module and execute the command 'npm run dev.' This will launch a static server that serves content from the path 'ui.frontend/src/main/webpack/static/index.html.' In this file, the client libraries (your CSS/JS) are already imported, so you will likely only need to adjust the HTML. This approach can significantly speed up your debugging and testing process.

You can learn more here:

https://experienceleague.adobe.com/en/docs/experience-manager-core-components/using/developing/arche... 

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/changes-of-frontend-module... 

Hope this helps