@sandy91 here's how the flow should be like:
- run: webpack build prod
- webpack transforms and builds the code, then minifies the css and js files and stores it directly into the DIST folder (configured by the webpack config).ou
- next, webpack invokes the clientlib-generator (using the clientlib.config.js) which copies files from the DIST folder to the destination clientlibs folder into the ui.apps maven module (example: /apps/my-site/clientlibs/frontend-clientlib).
- done.
- Now you can use your maven skills to deploy the code into your AEM instance. Once deployed, your front-end code can be accessed from /etc.clientlibs/my-site/clientlibs/frontend-clientlib.css|js
Of course, all this can be automated when you are utilising the maven front-end plugin.
Look at the latest AEM Maven archetype project's example of how they've implemented "mvn build" automation with the front-end project. Running the build and deploy maven command will utilise the maven front-end plugin, which will automate the initiation of the webpack build command, and finally deploy ui.apps, and all necessary maven modules directly into your AEM environment. , https://github.com/adobe/aem-project-archetype/tree/master/src/main/archetype/all.