Overview

flitter-less is an in-place compiler for LESS style-sheets for Flitter. That is, LESS styles placed in app/assets/less/ can be accessed as compiled CSS directly by referencing the name of the style-sheet after the /style-asset route.

Installation

Install the flitter-less package:

yarn install flitter-less

Add the Unit to the Units.flitter.js file, in the "Custom Units" section:

const FlitterUnits = {
    // ... other units ...

    /*
     * Custom Flitter Units
     * -------------------------------------------------------------
     * Custom units should be specified here. They will be loaded in order
     * after the core of Flitter has been initialized.
     */
     'Less'        : require('flitter-less/LessUnit'),

     // ... other units ...
}

module.exports = exports = FlitterUnits

Use

Using flitter-less is pretty straightforward. Place your .less files in app/assets/less/. Now, you can access them at the /style-asset route. For example, app/assets/less/index.less can be accessed at /style-asset/index.css.