fix: remove import of @edx/brand to can install modern-theming #23
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
💡Remove unnecessary @edx/brand/paragon SCSS imports when using modern-theming
This PR removes the following SCSS imports from the MFE’s style entry point:
Why
This MFE is configured to use modern-theming, which replaces traditional SASS-based theming with a CSS variables-based approach. In this setup, these SCSS imports are not only unnecessary, but can also cause issues.
Technical Context
modern-theming leverages design tokens and CSS custom properties instead of SASS variables and overrides.
These imports were previously needed for legacy SASS-based brand overrides, but:
With modern-theming, all theming is applied via the theme.js file and CSS variables.
Keeping these imports introduces resolution errors, particularly when modern-theming is aliased to @edx/brand, since it doesn’t expose those SCSS files.
Current Issue
The MFE fails to build due to errors resolving SCSS paths like:
This happens because @edx/brand is now pointing to modern-theming, which does not provide legacy SCSS files.
Official Reference
According to the official Open edX migration guide, these imports should be removed when migrating an MFE to use design tokens and CSS variables.
Expected Outcome
Fix build errors related to SCSS resolution.
Clean up unnecessary legacy theming code.
Align the MFE with modern Open edX theming practices.
Reduce confusion and maintenance overhead related to outdated SASS imports.
Merge Checklist
Post-merge Checklist