@silvanite/vuepress-plugin-tailwind/dist/index.js

Tailwind CSS plugin for VuePress

'use strict';

var lodash = require('lodash');

function _classCallCheck(instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
}

function _defineProperties(target, props) {
  for (var i = 0; i < props.length; i++) {
    var descriptor = props[i];
    descriptor.enumerable = descriptor.enumerable || false;
    descriptor.configurable = true;
    if ("value" in descriptor) descriptor.writable = true;
    Object.defineProperty(target, descriptor.key, descriptor);
  }
}

function _createClass(Constructor, protoProps, staticProps) {
  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  if (staticProps) _defineProperties(Constructor, staticProps);
  return Constructor;
}

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);
    if (enumerableOnly) symbols = symbols.filter(function (sym) {
      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
    });
    keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread2(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      ownKeys(source, true).forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      ownKeys(source).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
}

function _toConsumableArray(arr) {
  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread();
}

function _arrayWithoutHoles(arr) {
  if (Array.isArray(arr)) {
    for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];

    return arr2;
  }
}

function _iterableToArray(iter) {
  if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
}

function _nonIterableSpread() {
  throw new TypeError("Invalid attempt to spread non-iterable instance");
}

var defaultOptions = {
  purgecss: {
    enabled: true,

    /**
     *  Valid PurgeCss config options
     */
    purgecssOptions: {}
  }
};

var plugin = function plugin() {
  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var context = arguments.length > 1 ? arguments[1] : undefined;
  var themeConfig = context.themeConfig,
      siteConfig = context.siteConfig,
      cwd = context.cwd,
      isProd = context.isProd;

  var _merge = lodash.merge(defaultOptions, options),
      config = _merge.config,
      purgecss = _merge.purgecss;

  var plugins = [require("tailwindcss")(config), require("autoprefixer")];
  /**
   * Only run purge css in production.
   */

  if (isProd && purgecss.enabled) {
    /**
     * Ensure default resets and normalised classes are not removed by PurgeCSS
     */
    var whitelistPatterns = [/^(h\d|p$|ul|li$|div|ol|table|td$|th$|thead|tbody|main|input|button|form|md-|hljs)/];
    /**
     * check if whitelistPatterns already defined then merge it
     */

    if (purgecss.purgecssOptions.hasOwnProperty('whitelistPatterns')) {
      purgecss.purgecssOptions.whitelistPatterns = [].concat(whitelistPatterns, _toConsumableArray(purgecss.purgecssOptions.whitelistPatterns));
    } else {
      purgecss.purgecssOptions.whitelistPatterns = whitelistPatterns;
    }

    plugins.push(require("@fullhuman/postcss-purgecss")(_objectSpread2({
      content: ["".concat(cwd, "/.vuepress/theme/**/*.*"), "".concat(cwd, "/!(node_modules)/**/*.md")],
      extractors: [{
        /**
         * A fix for purge css to pick up class names with escaped chars
         * E.g. md:w-1/2.
         *
         * Solution from https://github.com/tailwindcss/tailwindcss/issues/391#issuecomment-366922730
         */
        extractor:
        /*#__PURE__*/
        function () {
          function TailwindExtractor() {
            _classCallCheck(this, TailwindExtractor);
          }

          _createClass(TailwindExtractor, null, [{
            key: "extract",
            value: function extract(content) {
              return content.match(/[A-z0-9-:\/]+/g) || [];
            }
          }]);

          return TailwindExtractor;
        }(),
        extensions: ["css", "html", "js", "vue", "md", "styl"]
      }]
    }, purgecss.purgecssOptions)));
  }
  /**
   * Merge in the site's purgecss config
   */


  siteConfig.postcss = lodash.merge(siteConfig.postcss || {}, {
    plugins: plugins
  });
  return {
    name: '@silvanite/vuepress-plugin-tailwind'
  };
};

module.exports = plugin;