Tim van der Lippe
6d109a9d45
This also adds Python-2.0 to the list of accepted licenses. Lastly, it fixes a bug where the package.json files were incorrectly reordered. For the `exports` of a particular package, the order that the entrypoints are defined in is crucial. Therefore, we should not alter the order of entrypoints and instead maintain the originally defined ordering. We can use an `OrderedDict` to ensure that Python always loads the JSON files in the same order. DISABLE_THIRD_PARTY_CHECK=NPM update R=jacktfranklin@chromium.org Bug: none Change-Id: I5a309782de6015edea6ba3b502aa0db1f008d973 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2692909 Auto-Submit: Tim van der Lippe <tvanderlippe@chromium.org> Reviewed-by: Jack Franklin <jacktfranklin@chromium.org> Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
postcss-less
A PostCSS Syntax for parsing LESS
Note: This module requires Node v6.14.4+. poscss-less is not a LESS compiler. For compiling LESS, please use the official toolset for LESS.
Install
Using npm:
npm install postcss-less --save-dev
Please consider becoming a patron if you find this module useful.
Usage
The most common use of postcss-less is for applying PostCSS transformations directly to LESS source. eg. ia theme written in LESS which uses Autoprefixer to add appropriate vendor prefixes.
const syntax = require('postcss-less');
postcss(plugins)
.process(lessText, { syntax: syntax })
.then(function (result) {
result.content // LESS with transformations
});
LESS Specific Parsing
@import
Parsing of LESS-specific @import statements and options are supported.
@import (option) 'file.less';
The AST will contain an AtRule node with:
- an
import: trueproperty - a
filename: <String>property containing the imported filename - an
options: <String>property containing any import options specified
Inline Comments
Parsing of single-line comments in CSS is supported.
:root {
// Main theme color
--color: red;
}
The AST will contain a Comment node with an inline: true property.
Mixins
Parsing of LESS mixins is supported.
.my-mixin {
color: black;
}
The AST will contain an AtRule node with a mixin: true property.
!important
Mixins that declare !important will contain an important: true property on their respective node.
Variables
Parsing of LESS variables is supported.
@link-color: #428bca;
The AST will contain an AtRule node with a variable: true property.
Note: LESS variables are strictly parsed - a colon (:) must immediately follow a variable name.
Stringifying
To process LESS code without PostCSS transformations, custom stringifier should be provided.
const postcss = require('postcss');
const syntax = require('postcss-less');
const less = `
// inline comment
.container {
.mixin-1();
.mixin-2;
.mixin-3 (@width: 100px) {
width: @width;
}
}
.rotation(@deg:5deg){
.transform(rotate(@deg));
}
`;
const result = await postcss().process(less, { syntax });
// will contain the value of `less`
const { content } = result;
Use Cases
- Lint LESS code with 3rd-party plugins.
- Apply PostCSS transformations (such as Autoprefixer) directly to the LESS source code