(archived) Migration to dart-sass

Archived page

The migration has already been done, keeping this page archived as this is no longer needed

Behind the scenes, to compile the CSS for the themes, Galaxy used Compass framework which has no longer been actively maintained for a few years.

To avoid technical debt and to improve performances, Galaxy will soon stop using Compass to compile to move to Dart Sass, the current primary implementation of Sass.

This will have 2 main impacts:

• Compass provided some mixins to help cross-browser compatibility. These mixins won’t be included anymore. (you can re-import them if needed)

• Sass compilation will be done with a more recent version of sass language, there are some small changes in the output file.

On most themes, no changes are required in the code and the transition will be transparent for the dev team.

Backoffice configuration

During the migration phase, to make testing easier, in the backoffice you can change the SASS compiler for your platform.

Before 2022-03-24

The default SASS compiler is Compass. You can force using dart-sass with a configuration in the backoffice key: CSS_PREPROCESSOR_ENGINE value: dart-sass

After 2022-03-24

The default SASS compiler on dev environments will be dart-sass

You can force using Compass with a configuration in the backoffice key: CSS_PREPROCESSOR_ENGINE value: compass

To override this configuration:

1. Connect to your dev environment

2. open the Mega Menu / Quicklinks, click on Galaxy (icon 'Star')

3. In the left menu, select 'Settings' in the 'System' section

4. Click on 'Add' to add the following the key/value (or modify it if it already exists)

• Key: CSS_PREPROCESSOR_ENGINE

• Value: dart-sass or compass

Save and you are good to work with it