Question: Using ui.frontend folder for SASS and React?

[ksurendra]

Question:
When using the new AEM Archetype (v23) general/react/angular sources are built into "ui.frontend" folder.

While this project (wknd) is a great resource/refer to build codebases for new projects, the "ui.frontend" in wknd is used for "sass" and this works great.

How can we build a new codebase using both react-app(when built with archetype 23) and sass (file structure as defined in wknd) i.e., AEM + React + SASS ?

[godanny86]

hi @ksurendra good question. If you just want to add Sass support to the React ui.frontend module generated by the archetype you should be able to follow: https://create-react-app.dev/docs/adding-a-sass-stylesheet. The ui.frontend (React) module is actually a webpack project based on the Create React App.

[godanny86]

Working example can now be found at: https://github.com/adobe/aem-guides-wknd-spa/blob/React/latest/ui.frontend/package.json#L19

[ksurendra]

Thanks @godanny86 for following up on this.