systemjs-less-plugin

Translates less on the browser, inlines CSS conversion during build.

This SystemJS plugin provides in-browser compilation of less stylesheets to regular CSS styles, as well as precompilation at the build stage when bundling your project with JSPM.

It depends (of course) on {Less} but you don't need to worry about it. We have it bundled along this loader plugin. It also depends on plugin-css and, again, you don't need to worry about that, because it'll be installed along system-less-plugin.

Installing

To use this plugin, install it with jspm like so:

jspm install less

Then, in your jspm.config file, add less as the loader for less files (duh!):

SystemJS.config({
  paths: {...}
  map: {...}
  meta: {
    '*.less': { loader: 'less' }
  }
});

Configuration and options

This plugin is built on top of the CSS plugin base which provides most of its features. As such, system-less-plugin supports the same build options.

Among other features, this includes source maps and generation of separate CSS files.

Import from jspm packages

Adds the ability for less to import from jspm packages (thanks to @fernandogmar based on lixiaoyan/less-plugin-jspm-import )

In less file:

@import "jspm://packagename/path/to/file.less";

or if importing a css file an import option is required:

@import (less) "jspm://packagename/path/to/file.css";

In case npm is down...

It's very uncommon for NPM to be down, but if that's your case or for any other reson you rather use github, then this is the way:

jspm install less=github:huasofoundries/systemjs-less-plugin

License

MIT