As some of you perhaps know, I’m a big fan of the BEM naming convention when it comes to working with CSS. I’ve just witnessed how much of a help it can be, especially on larger projects with multiple developers. So I thought I’d create a little plugin Aurelia BEM which offers a little helper to more easily apply Blocks, Elements and Modifiers to your target elements and as such reducing the repetitive work a bit.
Since it’s done with the new CLI which makes creating Plugins a breeze, it also contains a dev-app, which you can simply start with npm start, once you clone the repo. Besides the plugin itself, the dev-app makes use of stylelint with heavily adjusted rules to fit the working style. Moreover it uses the recent Sass modules feature which comes in handy when you’re importing multiple variables from other files.
The setup is very opinionated and is heavily influenced by the needs for Ranorex Webtestit, where e.g colors have to be in a file <theme-folder>/_colors.scss, which again map to our designers color palette, or strict use of only-class-based selectors. I’m sure this perhaps isn’t a fit for everyone, but I’d recommend taking a look if you’re interested and post questions here.