UIkit 2.11 – Sass, Gulp, Bower repo and more

Things are moving fast with UIkit. Here is the new UIkit 2.11, since we just haven’t had the time to blog about what’s new in UIkit 2.10. So here is a roundup of all the new stuff and what's happening in UIkit.

Bower Repository

The 2.11 release brings along a slightly changed project structure. The /dist folder has been removed from the UIkit repository. Now the distributions are automatically generated in a separate Bower UIkit repo. The package manager Bower allows you to load this repository into your project. It contains all CSS, Less, SCSS and JavaScript files from UIkit and its components.

All components are now sorted into a /core folder which contains the core components and a /components folder which contains the add-ons.

Sass port

We are very happy to announce that an official Sass port is also available in the Bower UIkit repo. It is automatically generated from the LESS source files. For more information check out the Sass documentation.

Gulp and BrowserSync

Up until recently we've been using Grunt as our favorite JS task runner. We have now decided to switch to Gulp. One of the reasons for this was performance. Gulp compiles all files into CSS within the blink of an eye, which will accelerate your workflow significantly.

This pays off when working with the UIkit test files. Before, we used client based JavaScript to compile Less on-the-fly in the browser. This is no longer necessary. A Gulp watch task compiles the CSS immediately, if any source file is changed. We also use BrowserSync to refresh the tests, not only in your browser but across multiple devices. It is so fast that you won't even notice when testing.

Better normalization

In UIkit 2.10 we made the effort of dissolving the dependency on normalize.css by distributing the code to relevant components. This makes it way easier to use UIkit in environments where it is not the primary CSS framework, e.g. you want to use UIkit for your plugin markup in WordPress. For example, you can use the button component stand-alone without loading Normalize. Less stuff will break and the UIkit components are more robust.

UIkit 3 and future

Before UIkit 3.0 you can still expect a couple more 2.x releases, which will include additional features. UIkit 3 itself will primarily contain breaking changes, like renamed classes, variables and markup. You can find a list of feature requests and ideas for UIkit here.

UIkit now also follows the GitFlow branching model. Which means that the master branch always reflects a production-ready state while the latest development is taking place on the develop branch.

We're excited to hear your thoughts and feedback on the latest releases.