Analyze Sass compilation pipeline

• Type: Spike
• Status: Closed
• Priority: Minor
• Resolution: Completed
• Affects Version/s: None
• Fix Version/s: None
• Component/s: JS Themes Toolkit, Dev Tools, Dynamic CSS filter (sass), RTL Infrastructure
• Labels: None
• Conclusion: There seems to be a viable path towards dart-sass through npm-scripts which is what we'll attempt.
• Epic Link: fi-dart-sass
• Sprint: S04E03 - The Queen is Dead, S04E04 - Ten Summoner's Tales

The first step to Consolidate and improve SCSS compilation process is to analyze our current sass compilation pipeline and draft a plan for the future.

As stated, here are some outstanding infrastructure pieces in our sass pipeline:

• CSSBuilder
• CSSRTLConverter

These 2 processes are are integrated via Gradle in BuildCSSTask

Additionally, our node-sass or liferay-r2 are used within our liferay-js-themes-toolkit to build the themes css and rtl files.

The goal of this technical spike is to analyze the current architecture and design a plan to replace the existing java processes with js-based ones like Dart Sass

*Acceptance Criteria:*

• A Research Document including:
  • Current tasks that generate CSS
  • Implementation Proposal
    • Plan with affected systems and necessary changes
  • PoC of how to integrate and replace some of the systems like dart-sass

*Additional Resources*

• Dart Sass
• Switch to dart-sass