Integrate SASS to CSS precompiler in the modeler - Mendix Forum

Integrate SASS to CSS precompiler in the modeler


Integrate a precompiler runtime into the modeler so you only have to edit the SCSS files and need not worry about anything else.

Currently many different tools exist to compile SASS into CSS files, adding complexity to the entire setup for each team member.

Just edit the SASS file using your favorite editor and have the modeler worry about the rest.

Also, when creating a deployment package, generate a minified CSS file with mapping to the SASS files for great performance and easy inspection in the browser.

5 answers

Great idea. At least add an option to generate the css and copy them to the deployment directory (no redeploy needed). Better even to add a sass-editor in Mendix. Better even to give page-elements a class-dropdown at the class-property.

With all this there is no more need for setting up Koala or Scout and Mendix will be an even greater IDE.


I’m quite new to Mendix and shocked to see that SCSS compilation is not handled automatically. This setup makes adapting to custom style requirements needlessly complex.

What is more, one of the main best practices in version control is to never commit automatically generated files. CSS generated from SCSS is such an example. We now have the situation that in the VCS the generated CSS files are also committed, which leads to confusion and duplication.


I do a lot of custom styling on top of a basic Atlas UI theme. Getting the SASS to CSS precompile consistent across colleague and customer configurations can be quite a challenge. This idea topic simply puts the precompile into the platform so developers just add their additional SASS files to the Atlas theme and edit them, resulting in a new custom.css everytime a change is made.

Atlas is a great improvement over its predecessor, before Atlas, a lot of the styling plumbing was duplicated into the custom structure, which led to confusing and sometimes difficulties in overruling default stuff. With Atlas UI, the custom area has only the custom-variables file, leaving the rest open to your imagination.

I don't see a major problem with styling in Mendix.


In theory this would be amazing.

But I dont know how good this would be in practice
atm the current state of mendix sass best practises is all over the place.

I think Mendix Sass needs a systematic theoretical approach before letting even more people tackle the Sass side of Mendix.

I'm also curious to how Atlas fits into this strategy?


I can imagine that when you start a new MX project that Jelte's gulp files are already in there, but that's a incrimental improvment to a huge problem that is styling in Mendix.


Great idea. I have been doing a lot of styling using Gulp (ux-theming) and it can be problematic, especially when you forget to add node_modules to SVN ignore (remark after step 4)).

I disagree on the mapping. This should be done locally, but you might want to opt out on deployment. CSS mappings (like JS mappings) are downloaded automatically by some browsers, adding overhead. For local testing this should be great, but don't add it on production. Minified CSS should be the standard for deployment indeed.