diff --git a/README.md b/README.md index 29e4d410..b883ab98 100644 --- a/README.md +++ b/README.md @@ -53,6 +53,26 @@ module.exports = { See the [LESS documentation](http://lesscss.org/usage/#command-line-usage-options) for all available options. LESS translates dash-case to camelCase. +### LESS plugins + +In order to use [plugins](http://lesscss.org/usage/#plugins), simply define +the `lessLoader.lessPlugins` option. You can also change the options key +with a query parameter: `"style!css!less?config=lessLoaderCustom"`. + +``` javascript +var LessPluginCleanCSS = require('less-plugin-clean-css'); + +module.exports = { + module: { + loaders: [...] + }, + lessLoader: + lessPlugins: [ + new LessPluginCleanCSS({advanced: true}) + ] +}; +``` + ## Note on imports webpack provides an [advanced mechanism to resolve files](http://webpack.github.io/docs/resolving.html). The less-loader stubs less' `fileLoader` and passes all queries to the webpack resolving engine. Thus you can import your less-modules from `node_modules` or `bower_components`. Just prepend them with a `~` which tells webpack to look-up the [`modulesDirectories`](http://webpack.github.io/docs/configuration.html#resolve-modulesdirectories) diff --git a/index.js b/index.js index b4b6999c..9c475f20 100644 --- a/index.js +++ b/index.js @@ -18,6 +18,7 @@ module.exports = function(source) { var cb = this.async(); var isSync = typeof cb !== "function"; var finalCb = cb || this.callback; + var configKey = query.config || 'lessLoader'; var config = { filename: this.resource, paths: [], @@ -44,6 +45,11 @@ module.exports = function(source) { config.plugins = config.plugins || []; config.plugins.push(webpackPlugin); + // If present, add custom LESS plugins. + if (this.options[configKey]) { + config.plugins = config.plugins.concat(this.options[configKey].lessPlugins || []); + } + // not using the `this.sourceMap` flag because css source maps are different // @see https://github.com/webpack/css-loader/pull/40 if (query.sourceMap) { diff --git a/test/index.test.js b/test/index.test.js index 39ce8356..d7942342 100644 --- a/test/index.test.js +++ b/test/index.test.js @@ -36,6 +36,15 @@ describe("less-loader", function() { query: "?sourceMap", devtool: "source-map" }); + test("should install plugins", "url-path", { + query: "?config=lessLoaderTest", + lessPlugins: [ + { wasCalled: false, install: function() {this.wasCalled = true;} } + ], + after: function(testVariables) { + this.lessPlugins[0].wasCalled.should.be.true; + } + }); it("should report error correctly", function(done) { webpack({ entry: path.resolve(__dirname, "../index.js") + "!" + @@ -109,6 +118,9 @@ function test(name, id, testOptions) { path: __dirname + "/output", filename: "bundle.js", libraryTarget: "commonjs2" + }, + lessLoaderTest: { + lessPlugins: testOptions.lessPlugins || [] } }, function onCompilationFinished(err, stats) { var actualMap;