How to use the postcss.plugin function in postcss

To help you get started, we’ve selected a few postcss examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github johandb / svg-drawing-tool / node_modules / autoprefixer / lib / autoprefixer.js View on Github external
}

  if (prefixes.add.selectors.length > 0) {
    return;
  }

  if (Object.keys(prefixes.add).length > 2) {
    return;
  }
  /* istanbul ignore next */


  result.warn('Greetings, time traveller. ' + 'We are in the golden age of prefix-less CSS, ' + 'where Autoprefixer is no longer needed for your stylesheet.');
}

module.exports = postcss.plugin('autoprefixer', function () {
  for (var _len = arguments.length, reqs = new Array(_len), _key = 0; _key < _len; _key++) {
    reqs[_key] = arguments[_key];
  }

  var options;

  if (reqs.length === 1 && isPlainObject(reqs[0])) {
    options = reqs[0];
    reqs = undefined;
  } else if (reqs.length === 0 || reqs.length === 1 && !reqs[0]) {
    reqs = undefined;
  } else if (reqs.length <= 2 && (reqs[0] instanceof Array || !reqs[0])) {
    options = reqs[1];
    reqs = reqs[0];
  } else if (typeof reqs[reqs.length - 1] === 'object') {
    options = reqs.pop();
github bmfe / eros-cli / utils / vue-loader / lib / style-rewriter.js View on Github external
var postcss = require('postcss')
var selectorParser = require('postcss-selector-parser')
var loaderUtils = require('loader-utils')

var addId = postcss.plugin('add-id', function (opts) {
  return function (root) {
    root.each(function rewriteSelector (node) {
      if (!node.selector) {
        // handle media queries
        if (node.type === 'atrule' && node.name === 'media') {
          node.each(rewriteSelector)
        }
        return
      }
      node.selector = selectorParser(function (selectors) {
        selectors.each(function (selector) {
          var node = null
          selector.each(function (n) {
            if (n.type !== 'pseudo') node = n
          })
          selector.insertAfter(node, selectorParser.attribute({
github maxlapides / dovetailer / lib / styles.js View on Github external
mqpacker,
      // minify
      cssnano({ discardUnused: { fontFace: false } })
    ]
    const { css: head } = await postcss(headPostcssPlugins).process(
      headStyles,
      postcssOpts
    )

    return { head, inline }
  }
}

/** POSTCSS PLUGINS **/

const postcssImportantEverything = postcss.plugin(
  'postcss-important-everything',
  () => css => {
    css.walkDecls(decl => {
      if (decl.parent.name !== 'font-face') {
        decl.important = true
      }
    })
  }
)

const pseudoClasses = [':hover', ':visited', ':active', ':focus']
const isPseudoClass = selector =>
  pseudoClasses.some(pseudoClass => selector.includes(pseudoClass))

const postcssExtractHeadStyles = styles =>
  postcss.plugin('postcss-extract-media', () => css => {
github cef62 / css-modules-compiler / src / postcss / discard-duplicates.js View on Github external
// if no exact match exist we search for children nodes duplication
    if (!checkChildren) {
      const nodes = mqCache.get(atRuleId)
      node.nodes.forEach((n) => {
        const ruleId = n.toString().replace(/(\s{2,})|(\r)|(\n)/gm, ' ')
        if (nodes.has(ruleId)) {
          node.removeChild(n)
        } else {
          nodes.add(ruleId)
        }
      })
    }
  })
}

module.exports = postcss.plugin('postcss-discard-duplicates', () => discardDuplicates)
github fossasia / susper.com / node_modules / postcss-import / index.js View on Github external
})
          if (!hasImport) {
            // save hash files to skip them next time
            if (!state.hashFiles[content]) state.hashFiles[content] = {}
            state.hashFiles[content][media] = true
          }
        }

        // recursion: import @import from imported file
        return parseStyles(result, styles, options, state, media)
      }
    )
  })
}

module.exports = postcss.plugin("postcss-import", AtImport)
github xing / hops / packages / config / lib / postcss-necsst.js View on Github external
'postcss-color-hwb',
  'postcss-color-hsl',
  'postcss-color-rgb',
  'postcss-color-gray',
  ['css-rrggbbaa', 'postcss-color-hex-alpha'],
  'postcss-color-function',
  'postcss-font-family-system-ui',
  'postcss-font-variant',
  ['css-all', 'css-initial-value', 'postcss-initial'],
  ['css-matches-pseudo', 'postcss-selector-matches'],
  ['css-not-sel-list', 'postcss-selector-not'],
  'postcss-pseudo-class-any-link',
  ['wordwrap', 'postcss-replace-overflow-wrap']
];

module.exports = postcss.plugin('postcss-necsst', function (options) {
  var processor = postcss();
  features.forEach(function (feature) {
    var conditions = [].concat(feature);
    feature = conditions.pop();
    if (!conditions.length || conditions.find(function (condition) {
      return !isSupported(condition, options.browsers);
    })) {
      processor.use(require(feature)(
        options[camelize(feature.replace(/^postcss-/, ''))]
      ));
    }
  });
  processor.use(
    autoprefixer(Object.assign(
      options.browsers ? { browsers: options.browsers } : {},
      options.autoprefixer
github FullHuman / purgecss / packages / postcss-purgecss / src / index.ts View on Github external
import postcss from "postcss";
import { PurgeCSS, defaultOptions, mergeExtractorSelectors } from "purgecss";

import { RawContent, UserDefinedOptions } from "./types";

type PurgeCSSPostCSSOptions = Omit;

const purgeCSSPlugin = postcss.plugin("postcss-plugin-purgecss", function(
  opts: PurgeCSSPostCSSOptions
) {
  return async function(root, result) {
    const purgeCSS = new PurgeCSS();
    const options = {
      ...defaultOptions,
      ...opts
    };
    purgeCSS.options = options;

    const { content, extractors } = options;

    const fileFormatContents = content.filter(
      o => typeof o === "string"
    ) as string[];
    const rawFormatContents = content.filter(
github ecomfe / node-lesslint / src / rule / shorthand.js View on Github external
const MSG = 'Color value can be abbreviated, must use the abbreviation form';

/**
 * 行数的缓存,避免相同的行报多次,因为这里是直接按照 value 值整体来报的
 */
let lineCache = 0;

/**
 * 具体的检测逻辑
 *
 * @param {Object} opts 参数
 * @param {*} opts.ruleVal 当前规则具体配置的值
 * @param {string} opts.fileContent 文件内容
 * @param {string} opts.filePath 文件路径
 */
export const check = postcss.plugin(RULENAME, opts =>
    (css, result) => {
        const ruleVal = opts.ruleVal;
        const realRuleVal = [];

        Array.prototype.push[Array.isArray(ruleVal) ? 'apply' : 'call'](realRuleVal, ruleVal);

        if (!realRuleVal.length) {
            return;
        }

        lineCache = 0;

        if (realRuleVal.indexOf('color') > -1) {

            css.walkDecls(decl => {
                const {value, source} = decl;
github monounity / karma-typescript / packages / karma-typescript-cssmodules-transform / dist / transform.js View on Github external
"use strict";
var log4js = require("log4js");
var os = require("os");
var postcss = require("postcss");
var log;
var json = {};
var parser = postcss.plugin("karma-typescript-cssmodules-transform-parser", function () {
    return function (css) {
        css.walkRules(function (rule) {
            if (rule.selector === ":export") {
                rule.walkDecls(function (decl) {
                    json[decl.prop] = decl.value;
                });
            }
        });
    };
});
var configure = function (postcssOptions, options, filter) {
    postcssOptions = postcssOptions || {};
    options = options || {};
    filter = (filter instanceof RegExp) ? filter : /\.css$/;
    var genericNames = require("generic-names");
    var scopedNameGenerator = options.generateScopedName || "[name]_[local]_[hash:base64:5]";