Home

Awesome

svelte-preprocess-less

CircleCI codecov

Svelte preprocessor for less

Installation

npm install --save-dev svelte-preprocess-less less

Usage

Using rollup-plugin-svelte

// rollup.config.js
import svelte from 'rollup-plugin-svelte';
import { less } from 'svelte-preprocess-less';
...

export default {
  ...
  plugins: [
    ...
    svelte({
      preprocess: {
        style: less(),
      },
    }),
  ],
};

Now all <style> elements in your components that have a type="text/less" or lang="less" attribute will be preprocessed by less.

Passing options to less

The less function passes the first argument to the less compiler, e.g.:

...
less({
  plugins: [
    ...
  ]
})

Filtering styles

The less function passes the second argument to svelte-preprocess-filter, e.g.:

...
less(
  {} // Empty less options
  { all: true } // Preprocess all styles
)

For available options visit the less documentation.