JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 58213
  • Score
    100M100P100Q147768F
  • License MIT

Extract certain nodes from CSS code

Package Exports

  • css-node-extract

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (css-node-extract) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

css-node-extract

Build Status

Extract certain nodes from CSS code.

Filters

  • at-rules: @media, @supports, @mixin,...
  • declarations: $variable, @variable,...
  • functions: @function
  • mixins: @mixin and .less-mixin-selector()
  • rules: .class-selector, #id-selector,...
  • silent: Extract only nodes that do not compile to CSS code (mixins, placeholder selectors, variables,...)
  • variables: $sass-variable and @less-variable
  • custom: Define a custom filter

Demos

var CssNodeExtract = require('css-node-extract');
var postcssScssSyntax = require('postcss-scss');

var options = {
  // CSS source code as string.
  css: '$variable: "value"; .selector { } .other-selector { }',
  // Extract only variables.
  filterNames: ['variables'],
  // postcss syntax plugin to add support for SCSS code.
  postcssSyntax: postcssScssSyntax
};

// Asynchronous:
CssNodeExtract.process(options).then((extractedCss) => {
  console.log(extractedCss); // Outputs: '$variable: "value";'.
});

// Synchronous:
var extractedCss = CssNodeExtract.processSync(options);
console.log(extractedCss); // Outputs: '$variable: "value";'.

Custom filter

var CssNodeExtract = require('css-node-extract');

var options = {
  // CSS source code as string.
  css: '@keyframes { } .selector { } .other-selector { }',
  filterNames: ['custom'],
  customFilter: [
    [
      { property: 'type', value: 'atrule' },
      { property: 'name', value: 'keyframes' }
    ]
  ]
};

CssNodeExtract.process(options).then((extractedCss) => {
  console.log(extractedCss); // Outputs: '@keyframes { }'.
});

Development

See CONTRIBUTING.md

Testing

npm test

About

Author

Markus Oberlehner
Twitter: https://twitter.com/MaOberlehner
PayPal.me: https://paypal.me/maoberlehner

License

MIT