rollup-plugin-less2

3.0.1 verified Mon Apr 27 auth: no javascript maintenance

Rollup plugin to compile Less files to CSS, with optional CSS modules support via less-plugin-css-modules. Current stable version is 3.0.1, last updated in 2019; no recent releases. It integrates Less preprocessing into Rollup builds, handling includes/excludes, sourcemaps, and custom output. Different from rollup-plugin-less (v1) by supporting CSS modules and offering more output flexibility. Node >=4 required; primarily used for legacy projects still on Rollup 1.x.

Common errors

error TypeError: RollupPluginLess2 is not a function ↓

cause Using CJS require without default export handling.

fix

Use import RollupPluginLess2 from 'rollup-plugin-less2' or const { default: RollupPluginLess2 } = require('rollup-plugin-less2');

error Error: Cannot find module 'less-plugin-css-modules' ↓

cause Package required when cssModules: true but not installed.

fix

Run npm install less-plugin-css-modules --save-dev

error Error: .less files not processed (no output) ↓

cause Missing include pattern or plugin order issue.

fix

Ensure include option covers your Less files, e.g., include: ['src/**/*.less']

Warnings

breaking Version 2.x to 3.0 changed default export name from 'less' to 'rollup-plugin-less2'. ↓

fix Use import RollupPluginLess2 from 'rollup-plugin-less2' instead of import less from 'rollup-plugin-less2'.

deprecated Package last updated in 2019; no support for Rollup 2.x or 3.x. ↓

fix Consider using rollup-plugin-postcss or @rollup/plugin-legacy for newer Rollup versions.

gotcha When cssModules: true, you must also provide less-plugin-css-modules as a dependency. ↓

fix Install less-plugin-css-modules and pass it in options.plugins.

gotcha output option can be false, string, or function; if false, CSS is emitted as a file via Rollup's output. ↓

fix Set output to a filename string to write to that path, or a function for custom handling.

Install

npm install rollup-plugin-less2

yarn add rollup-plugin-less2

pnpm add rollup-plugin-less2

Imports

default

wrong

const RollupPluginLess2 = require('rollup-plugin-less2');

correct

import RollupPluginLess2 from 'rollup-plugin-less2';

ESM default export. CJS require works in Node but TypeScript may require esModuleInterop.

Quickstart

Basic Rollup config with Less preprocessing and CSS modules.

import RollupPluginLess2 from 'rollup-plugin-less2';
import LessPluginCssModules from 'less-plugin-css-modules';

export default {
  input: 'src/index.js',
  output: {
    file: 'dist/bundle.js',
    format: 'iife'
  },
  plugins: [
    RollupPluginLess2({
      output: false,
      cssModules: true,
      options: {
        plugins: [
          new LessPluginCssModules({
            mode: 'local',
            hashPrefix: 'test',
            generateScopedName: '[local]___[hash:base64:5]'
          })
        ]
      }
    })
  ]
};