Fix includePaths and improve tests

.travis.yml

@@ -1,4 +1,4 @@
 language: node_js
 node_js:
-  - '5'
-  - '4'
+  - node
+  - 6

CHANGELOG.md

@@ -1,6 +1,8 @@
 # less-brunch `<unreleased>`
 * Added support for CSS Modules with Brunch.
 * Added ability to pass any options to the less compiler.
+* Updated LESS to latest 3.9.x
+* Updated PostCSS to latest 7.0.x
 
 # less-brunch 2.0.0 (Jan 29, 2016)
 * Updated source code & API. The plugin would now only work with Brunch 2.2 and higher.

README.md

@@ -1,21 +1,20 @@
 ## less-brunch
-Adds [LESS](http://lesscss.org/) support to
-[brunch](http://brunch.io).
+Adds [LESS](http://lesscss.org/) support to [Brunch](http://brunch.io).
 
 ## Usage
 `npm install --save-dev less-brunch`
 
 ### Options
-Pass options as per [lessc's documentation](http://lesscss.org/usage/index.html) in your `brunch-config`,
+Pass options as per [LESS documentation](http://lesscss.org/usage/#using-less-in-the-browser-options) in your `brunch-config.js`,
 e.g. print source-file references in output by setting `dumpLineNumbers`.
 
-```javascript
+```js
 module.exports = {
   // ...
   plugins: {
     less: {
-      dumpLineNumbers: 'comments' // other values: 'mediaquery', 'all'
-      // ... other options
+      dumpLineNumbers: 'comments', // other values: 'mediaquery', 'all'
+      includePaths: ['node_modules/fancy-framework/less'],
     }
   }
 };
@@ -27,7 +26,7 @@ In production mode line numbers are suppressed.
 ### CSS Modules
 Starting Brunch `2.6`, you can use CSS Modules with less-brunch. To enable it, change your config to:
 
-```javascript
+```js
 module.exports = {
   // ...
   plugins: {
@@ -48,7 +47,7 @@ Then, author your styles like you normally would:
 
 And reference CSS class names by requiring the specific style into your javascript:
 
-```javascript
+```js
 var style = require('./title.less');
 
 <h1 className={style.title}>Yo</h1>

index.js

@@ -6,14 +6,17 @@ const progeny = require('progeny');
 
 const postcss = require('postcss');
 const postcssModules = require('postcss-modules');
+const dataUri = /data-uri\s*\(\s*("|'|)([^)]*)\1\s*\)/g;
 
 const cssModulify = (path, data, map) => {
   let json = {};
-  const getJSON = (_, _json) => json = _json;
+  const getJSON = (_, _json) => {
+    json = _json;
+  };
 
   return postcss([postcssModules({getJSON})]).process(data, {from: path, map}).then(x => {
-    const exports = 'module.exports = ' + JSON.stringify(json) + ';';
-    return { data: x.css, map: x.map, exports };
+    const exports = `module.exports = ${JSON.stringify(json)};`;
+    return {data: x.css, map: x.map, exports};
   });
 };
 
@@ -37,18 +40,20 @@ class LESSCompiler {
     this.modules = this.config.modules || this.config.cssModules;
     delete this.config.modules;
     delete this.config.cssModules;
+
+    this.includePaths = [].concat(this.config.includePaths || []);
+    delete this.config.includePaths;
   }
 
   // Get dependencies from file
   _deps(file) {
     return new Promise((resolve, reject) => {
       progeny({rootPath: this.rootPath})(file.path, file.data, (err, deps) => {
         if (!err) {
-          const re = /data-uri\s*\(\s*("|'|)([^)]*)\1\s*\)/g;
-          let match;
-          while (match = re.exec(file.data)) {
-            deps.push(sysPath.join(sysPath.dirname(file.path), match[2]));
-          }
+          const dir = sysPath.dirname(file.path);
+          file.data.replace(dataUri, (_, __, dep) => {
+            deps.push(sysPath.join(dir, dep));
+          });
         }
         if (err) reject(err);
         else resolve(deps);
@@ -68,20 +73,17 @@ class LESSCompiler {
     return this._deps(data);
   }
 
-  compile(file) {
-    const data = file.data;
-    const path = file.path;
-    const paths = [this.rootPath, sysPath.dirname(path)]
-          .concat(this.config.options.includePaths);
+  compile({data, path}) {
     const config = Object.assign({}, this.config, {
-      paths: paths,
+      paths: [this.rootPath, sysPath.dirname(path), ...this.includePaths],
       filename: path,
-      dumpLineNumbers: !this.optimize && this.config.dumpLineNumbers
+      dumpLineNumbers: !this.optimize && this.config.dumpLineNumbers,
+      sourceMap: {},
     });
 
-    return less.render(data, config).then(output => {
-      const data = output.css;
-      return this.modules ? cssModulify(path, data) : {data};
+    return less.render(data, config).then(res => {
+      const data = res.css;
+      return this.modules ? cssModulify(path, data) : {data, map: res.map};
     }, formatError(path));
   }
 }
@@ -90,5 +92,4 @@ LESSCompiler.prototype.brunchPlugin = true;
 LESSCompiler.prototype.type = 'stylesheet';
 LESSCompiler.prototype.extension = 'less';
 
-
 module.exports = LESSCompiler;

package.json

@@ -17,14 +17,18 @@
     "test": "eslint index.js && mocha"
   },
   "dependencies": {
-    "less": "~2.7.1",
-    "postcss": "~5.0.19",
-    "postcss-modules": "~0.4.0",
-    "progeny": "~0.5.0"
+    "less": "~3.9.0",
+    "postcss": "~7.0.8",
+    "postcss-modules": "~1.4.1",
+    "progeny": "~0.12.0"
   },
   "devDependencies": {
-    "mocha": "^2.1.0",
-    "chai": "^1.10.0",
-    "eslint": "^2.1.0"
+    "chai": "^4.0",
+    "eslint": "^5.12.0",
+    "eslint-config-brunch": "^1.0.0",
+    "mocha": "^5.2.0"
+  },
+  "eslintConfig": {
+    "extends": "brunch"
   }
 }

test/fixtures/data-uri-double.less

@@ -0,0 +1,3 @@
+.bar {
+  background: data-uri("img/bar.jpg");
+}

test/fixtures/data-uri-single.less

@@ -0,0 +1,3 @@
+.baz {
+  background: data-uri('img/baz.jpg');
+}

test/fixtures/data-uri.less

@@ -0,0 +1,6 @@
+@import "data-uri-double.less";
+@import "data-uri-single.less";
+
+.foo {
+  background: data-uri(img/foo.jpg);
+}

test/fixtures/include-paths.less

@@ -0,0 +1 @@
+@import "foo.less";

test/fixtures/include-paths/foo.less

@@ -0,0 +1,3 @@
+.foo {
+  color: rebeccapurple;
+}