From 240b2bc4a628d4f6c1c1432a256443239b3096b7 Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 12:59:40 +0400 Subject: [PATCH 1/8] use eslint-config-brunch --- .eslintrc.json | 83 -------------------------------------------------- package.json | 3 ++ 2 files changed, 3 insertions(+), 83 deletions(-) delete mode 100644 .eslintrc.json diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index f4c85b2..0000000 --- a/.eslintrc.json +++ /dev/null @@ -1,83 +0,0 @@ -{ - "env": { - "node": true, - "es6": true - }, - "rules": { - "block-spacing": [2, "always"], - "brace-style": [2, "1tbs", {"allowSingleLine": true}], - "comma-style": [2, "last"], - "func-style": [2, "expression"], - "semi": [2, "always"], - "quotes": [2, "single", "avoid-escape"], - "indent": [2, 2, {"SwitchCase": 1}], - "dot-location": [2, "property"], - "camelcase": [1, {"properties": "always"}], - "comma-spacing": [2, {"before": false, "after": true}], - "comma-dangle": [2, "never"], - "semi-spacing": [2, {"before": false, "after": true}], - "curly": [2, "multi-line", "consistent"], - "no-debugger": 2, - "no-dupe-args": 2, - "no-dupe-keys": 2, - "no-duplicate-case": 2, - "no-empty": 2, - "no-ex-assign": 2, - "no-extra-semi": 2, - "no-func-assign": 2, - "no-irregular-whitespace": 2, - "no-sparse-arrays": 2, - "no-unexpected-multiline": 2, - "no-unreachable": 2, - "no-unused-vars": [2, {"varsIgnorePattern": "ignored"}], - "valid-typeof": 2, - "eqeqeq": [2, "allow-null"], - "no-array-constructor": 2, - "no-caller": 2, - "no-eval": 2, - "no-extend-native": 2, - "no-extra-bind": 2, - "no-fallthrough": 2, - "no-labels": 2, - "no-iterator": 2, - "no-magic-numbers": [1, {"ignore": [-1, 0, 1, 2, 3, 4, 5, 6, 7, 8]}], - "no-multi-spaces": 2, - "no-native-reassign": 2, - "no-new-func": 2, - "no-new-wrappers": 2, - "no-new": 2, - "no-octal-escape": 2, - "no-octal": 2, - "no-redeclare": 2, - "no-self-compare": 2, - "no-sequences": 2, - "no-unused-expressions": 2, - "no-useless-call": 2, - "no-warning-comments": [1, {"terms": ["todo", "fixme", "xxx"], "location": "start"}], - "no-with": 2, - "new-parens": 2, - "wrap-iife": [2, "inside"], - "no-catch-shadow": 2, - "no-delete-var": 2, - "no-shadow-restricted-names": 2, - "no-undef": 2, - "callback-return": 2, - "handle-callback-err": 2, - "no-path-concat": 2, - "array-bracket-spacing": 2, - "eol-last": 2, - "no-multiple-empty-lines": [2, {"max": 2}], - "no-spaced-func": 2, - "no-trailing-spaces": 2, - "no-unneeded-ternary": 2, - "keyword-spacing": 2, - "space-before-blocks": 2, - "space-before-function-paren": [2, "never"], - "space-in-parens": 2, - "space-unary-ops": [2, {"words": true, "nonwords": false}], - "arrow-spacing": [2, {"before": true, "after": true}], - "prefer-arrow-callback": 2, - "prefer-template": 0, - "prefer-const": 2 - } -} diff --git a/package.json b/package.json index fc61e76..040545e 100644 --- a/package.json +++ b/package.json @@ -26,5 +26,8 @@ "mocha": "^2.1.0", "chai": "^1.10.0", "eslint": "^2.1.0" + "eslint-config-brunch": "^1.0", + "eslintConfig": { + "extends": "brunch" } } From 7eeb6a65043e73119ba555ffb2bb059b8ed56b95 Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 12:59:47 +0400 Subject: [PATCH 2/8] update travis targets --- .travis.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.travis.yml b/.travis.yml index dcf7cae..9ff972e 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,4 +1,4 @@ language: node_js node_js: - - '5' - - '4' + - node + - 6 From 05fac53e912c04be0c52d4f74f136cd340d83bbc Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 12:59:57 +0400 Subject: [PATCH 3/8] update dev-deps --- package.json | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 040545e..5be6f5f 100644 --- a/package.json +++ b/package.json @@ -23,10 +23,11 @@ "progeny": "~0.5.0" }, "devDependencies": { - "mocha": "^2.1.0", - "chai": "^1.10.0", - "eslint": "^2.1.0" + "chai": "^4.0", + "eslint": "^4.0", "eslint-config-brunch": "^1.0", + "mocha": "^3.0" + }, "eslintConfig": { "extends": "brunch" } From 6a995f197cd24dece3d3e095e930c688c6ab20a4 Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 13:03:06 +0400 Subject: [PATCH 4/8] update README.md --- README.md | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 50bc18d..7286d65 100644 --- a/README.md +++ b/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');

Yo

From fbc24a48e26ff7d69efa67e1de7cef2bdc4e334f Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 13:03:13 +0400 Subject: [PATCH 5/8] pass linter --- index.js | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/index.js b/index.js index 2eccd43..ce16970 100644 --- a/index.js +++ b/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,6 +40,9 @@ 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 @@ -44,11 +50,10 @@ class LESSCompiler { 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,15 +73,11 @@ 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, }); return less.render(data, config).then(output => { @@ -90,5 +91,4 @@ LESSCompiler.prototype.brunchPlugin = true; LESSCompiler.prototype.type = 'stylesheet'; LESSCompiler.prototype.extension = 'less'; - module.exports = LESSCompiler; From d8c23785390ca158ad79d2e099fa6d29f182de6d Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 13:03:18 +0400 Subject: [PATCH 6/8] improve tests --- test-files/test-dependency-resolution.less | 5 -- test-files/test-include.less | 4 - test.js | 62 -------------- test/fixtures/data-uri-double.less | 3 + test/fixtures/data-uri-single.less | 3 + test/fixtures/data-uri.less | 6 ++ test/fixtures/include-paths.less | 1 + test/fixtures/include-paths/foo.less | 3 + test/index.js | 94 ++++++++++++++++++++++ 9 files changed, 110 insertions(+), 71 deletions(-) delete mode 100644 test-files/test-dependency-resolution.less delete mode 100644 test-files/test-include.less delete mode 100644 test.js create mode 100644 test/fixtures/data-uri-double.less create mode 100644 test/fixtures/data-uri-single.less create mode 100644 test/fixtures/data-uri.less create mode 100644 test/fixtures/include-paths.less create mode 100644 test/fixtures/include-paths/foo.less create mode 100644 test/index.js diff --git a/test-files/test-dependency-resolution.less b/test-files/test-dependency-resolution.less deleted file mode 100644 index 8e3c1d7..0000000 --- a/test-files/test-dependency-resolution.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "test-include.less"; - -.foo{ - background: data-uri("img/foo.jpg"); -} diff --git a/test-files/test-include.less b/test-files/test-include.less deleted file mode 100644 index 6ed8f96..0000000 --- a/test-files/test-include.less +++ /dev/null @@ -1,4 +0,0 @@ - -.bar{ - background: data-uri("img/bar.jpg"); -} diff --git a/test.js b/test.js deleted file mode 100644 index 7ec9305..0000000 --- a/test.js +++ /dev/null @@ -1,62 +0,0 @@ -/* eslint-env mocha */ -/* eslint no-unused-expressions: off */ - -'use strict'; - -const fs = require('fs'); -const join = require('path').join; -const expect = require('chai').expect; -const LESSCompiler = require('./'); - -describe('less-brunch', () => { - let plugin; - - beforeEach(() => { - plugin = new LESSCompiler({ - paths: {root: '.'}, - plugins: {}, - }); - }); - - it('should be an object', () => { - expect(plugin).to.be.an.instanceof(LESSCompiler); - }); - - it('should have #compile method', () => { - expect(plugin).to.respondTo('compile'); - }); - - it('should have #getDependencies method', () => { - expect(plugin).to.respondTo('getDependencies'); - }); - - it('should compile and produce valid result', () => { - const data = '@color: #4D926F; #header {color: @color;}'; - const expected = '#header {\n color: #4D926F;\n}\n'; - - return plugin.compile({data, path: 'style.less'}).then(result => { - expect(result.data).to.equal(expected); - }); - }); - - it('should handle invalid less gracefully', () => { - const data = '#header {color: @color;}'; - const expected = 'L1:16 NameError: variable @color is undefined'; - - return plugin.compile({data, path: 'style.less'}).catch(error => { - expect(error.toString()).to.equal(expected); - }); - }); - - it('should correctly identify stylesheet and data-uri dependencies', () => { - const path = 'test-files/test-dependency-resolution.less'; - const data = fs.readFileSync(path, 'utf-8'); - - return plugin.getDependencies({data, path}).then(deps => { - expect(deps).to.deep.equal([ - join('test-files', 'test-include.less'), - join('test-files', 'img', 'foo.jpg'), - ]); - }); - }); -}); diff --git a/test/fixtures/data-uri-double.less b/test/fixtures/data-uri-double.less new file mode 100644 index 0000000..6175c0f --- /dev/null +++ b/test/fixtures/data-uri-double.less @@ -0,0 +1,3 @@ +.bar { + background: data-uri("img/bar.jpg"); +} diff --git a/test/fixtures/data-uri-single.less b/test/fixtures/data-uri-single.less new file mode 100644 index 0000000..bf706f6 --- /dev/null +++ b/test/fixtures/data-uri-single.less @@ -0,0 +1,3 @@ +.baz { + background: data-uri('img/baz.jpg'); +} diff --git a/test/fixtures/data-uri.less b/test/fixtures/data-uri.less new file mode 100644 index 0000000..40fed2d --- /dev/null +++ b/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); +} diff --git a/test/fixtures/include-paths.less b/test/fixtures/include-paths.less new file mode 100644 index 0000000..ad17e04 --- /dev/null +++ b/test/fixtures/include-paths.less @@ -0,0 +1 @@ +@import "foo.less"; diff --git a/test/fixtures/include-paths/foo.less b/test/fixtures/include-paths/foo.less new file mode 100644 index 0000000..2166a7e --- /dev/null +++ b/test/fixtures/include-paths/foo.less @@ -0,0 +1,3 @@ +.foo { + color: rebeccapurple; +} diff --git a/test/index.js b/test/index.js new file mode 100644 index 0000000..16fb900 --- /dev/null +++ b/test/index.js @@ -0,0 +1,94 @@ +/* eslint-env mocha */ +/* eslint no-unused-expressions: off */ + +'use strict'; + +const fs = require('fs'); +const {join} = require('path'); +const {expect} = require('chai'); +const LESSCompiler = require('..'); + +const fixtures = join('test', 'fixtures'); +const fixture = name => { + const path = join(fixtures, name); + const data = fs.readFileSync(path, 'utf-8'); + + return {path, data} +}; + +describe('less-brunch', () => { + let plugin; + + beforeEach(() => { + plugin = new LESSCompiler({ + paths: {root: '.'}, + plugins: { + less: { + includePaths: [join(fixtures, 'include-paths')], + }, + }, + }); + }); + + it('should be an object', () => { + expect(plugin).to.be.an.instanceof(LESSCompiler); + }); + + it('should have #compile method', () => { + expect(plugin).to.respondTo('compile'); + }); + + it('should compile and produce valid result', () => { + const data = '@color: #4D926F; #header {color: @color;}'; + const compiled = '#header {\n color: #4D926F;\n}\n'; + + return plugin.compile({data, path: 'style.less'}).then(result => { + expect(result.data).to.equal(compiled); + }); + }); + + it('should respect `includePaths` option', () => { + const file = fixture('include-paths.less'); + const compiled = '.foo {\n color: rebeccapurple;\n}\n'; + + return plugin.compile(file).then(result => { + expect(result.data).to.equal(compiled); + }); + }); + + it('should handle invalid less gracefully', () => { + const data = '#header {color: @color;}'; + const msg = 'L1:16 NameError: variable @color is undefined'; + + return plugin.compile({data, path: 'style.less'}).catch(error => { + expect(error.toString()).to.equal(msg); + }); + }); + + it('should have #getDependencies method', () => { + expect(plugin).to.respondTo('getDependencies'); + }); + + it('should correctly identify stylesheet dependencies', () => { + const file = fixture('data-uri.less'); + + return plugin.getDependencies(file).then(deps => { + expect(deps).to.include( + join(fixtures, 'data-uri-double.less'), + join(fixtures, 'data-uri-single.less') + ); + }); + }); + + it('should correctly identify data-uri dependencies', () => { + const file = fixture('data-uri.less'); + + return plugin.getDependencies(file).then(deps => { + expect(deps).to.include( + join(fixtures, 'img', 'foo.jpg'), + join(fixtures, 'img', 'bar.jpg'), + join(fixtures, 'img', 'baz.jpg') + ); + }); + }); +}); From d1c6886eb08624dfab1e48cff7451828c118bf91 Mon Sep 17 00:00:00 2001 From: Aleksey Shvayka Date: Sat, 29 Jul 2017 13:11:29 +0400 Subject: [PATCH 7/8] generate sourcemap --- index.js | 7 ++++--- test/index.js | 13 ++++++++++++- 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/index.js b/index.js index ce16970..8ff4834 100644 --- a/index.js +++ b/index.js @@ -78,11 +78,12 @@ class LESSCompiler { paths: [this.rootPath, sysPath.dirname(path), ...this.includePaths], filename: path, 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)); } } diff --git a/test/index.js b/test/index.js index 16fb900..b3f38b5 100644 --- a/test/index.js +++ b/test/index.js @@ -21,7 +21,9 @@ describe('less-brunch', () => { beforeEach(() => { plugin = new LESSCompiler({ - paths: {root: '.'}, + paths: { + root: '.', + }, plugins: { less: { includePaths: [join(fixtures, 'include-paths')], @@ -47,6 +49,15 @@ describe('less-brunch', () => { }); }); + it('should generate valid source map', () => { + const data = '@color: #4D926F; #header {color: @color;}'; + const compiled = '#header {\n color: #4D926F;\n}\n'; + + return plugin.compile({data, path: 'style.less'}).then(result => { + expect(JSON.parse(result.map)).to.be.an('object'); + }); + }); + it('should respect `includePaths` option', () => { const file = fixture('include-paths.less'); const compiled = '.foo {\n color: rebeccapurple;\n}\n'; From db821766e7cc34678fb5ab51f9e8b93417b0f564 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?antoine=20beau=E1=B5=9B=E1=B5=83=E1=B4=B5=CB=A2=E2=81=BBla?= =?UTF-8?q?c=E1=B5=83=CB=A2=CB=A2=E1=B5=89?= <6146775+beaulac@users.noreply.github.com> Date: Sun, 10 Mar 2019 20:47:07 -0400 Subject: [PATCH 8/8] Upgrade to LESS 3.9.x (#49) --- CHANGELOG.md | 2 ++ package.json | 14 +++++++------- 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 6a936f1..e8c554e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,8 @@ # less-brunch `` * 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. diff --git a/package.json b/package.json index 5be6f5f..df4728a 100644 --- a/package.json +++ b/package.json @@ -17,16 +17,16 @@ "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": { "chai": "^4.0", - "eslint": "^4.0", - "eslint-config-brunch": "^1.0", - "mocha": "^3.0" + "eslint": "^5.12.0", + "eslint-config-brunch": "^1.0.0", + "mocha": "^5.2.0" }, "eslintConfig": { "extends": "brunch"