postcss-mixins - npm Package Compare versions

Comparing version 6.2.3 to 7.0.0

CHANGELOG.md

 # Change Log
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## 7.0
+* Moved to PostCSS 8.
+* Moved `postcss` to `peerDependencies`.
+* Fix docs (by Frank Showalter).
+
 ## 6.2.3
@@ -5,0 +10,0 @@ * Fix plugin to work with webpack watch (by @Mesqalito).

index.js

@@ -1,18 +0,74 @@
-var jsToCss = require('postcss-js/parser')
-var postcss = require('postcss')
-var sugarss = require('sugarss')
-var globby = require('globby')
-var vars = require('postcss-simple-vars')
-var path = require('path')
-var fs = require('fs')
-var isWindows = require('os').platform().indexOf('win32') !== -1
+let { join, basename, extname, relative } = require('path')
+let { promisify } = require('util')
+let { platform } = require('os')
+let jsToCss = require('postcss-js/parser')
+let sugarss = require('sugarss')
+let globby = require('globby')
+let vars = require('postcss-simple-vars')
+let fs = require('fs')
 
-function insideDefine (rule) {
-  var parent = rule.parent
-  if (!parent) {
+let readFile = promisify(fs.readFile)
+
+let IS_WIN = platform().includes('win32')
+
+function addMixin (helpers, mixins, rule, file) {
+  let name = rule.params.split(/\s/, 1)[0]
+  let other = rule.params.slice(name.length).trim()
+
+  let args = []
+  if (other.length) {
+    args = helpers.list.comma(other).map(str => {
+      let arg = str.split(':', 1)[0]
+      let defaults = str.slice(arg.length + 1)
+      return [arg.slice(1).trim(), defaults.trim()]
+    })
+  }
+
+  let content = false
+  rule.walkAtRules('mixin-content', () => {
+    content = true
     return false
-  } else if (parent.name === 'define-mixin') {
-    return true
-  } else {
-    return insideDefine(parent)
+  })
+
+  mixins[name] = { mixin: rule, args, content }
+  if (file) mixins[name].file = file
+  rule.remove()
+}
+
+async function loadGlobalMixin (helpers, globs) {
+  let cwd = process.cwd()
+  let files = await globby(globs, { caseSensitiveMatch: IS_WIN })
+  let mixins = {}
+  await Promise.all(
+    files.map(async i => {
+      let ext = extname(i).toLowerCase()
+      let name = basename(i, extname(i))
+      let path = join(cwd, relative(cwd, i))
+      if (ext === '.css' || ext === '.pcss' || ext === '.sss') {
+        let content = await readFile(path)
+        let root
+        if (ext === '.sss') {
+          root = sugarss.parse(content, { from: path })
+        } else {
+          root = helpers.parse(content, { from: path })
+        }
+        root.walkAtRules('define-mixin', atrule => {
+          addMixin(helpers, mixins, atrule, path)
+        })
+      } else {
+        mixins[name] = { mixin: require(path), file: path }
+      }
+    })
+  )
+  return mixins
+}
+
+function addGlobalMixins (helpers, local, global, parent) {
+  for (let name in global) {
+    helpers.result.messages.push({
+      type: 'dependency',
+      file: global[name].file,
+      parent: parent || ''
+    })
+    local[name] = global[name]
   }
@@ -22,3 +78,3 @@ }
 function processMixinContent (rule, from) {
-  rule.walkAtRules('mixin-content', function (content) {
+  rule.walkAtRules('mixin-content', content => {
     if (from.nodes && from.nodes.length > 0) {
@@ -32,8 +88,7 @@ content.replaceWith(from.clone().nodes)
 
-function insertObject (rule, obj, processMixins) {
-  var root = jsToCss(obj)
-  root.each(function (node) {
+function insertObject (rule, obj) {
+  let root = jsToCss(obj)
+  root.each(node => {
     node.source = rule.source
   })
-  processMixins(root)
   processMixinContent(root, rule)
@@ -43,15 +98,15 @@ rule.parent.insertBefore(rule, root)
 
-function insertMixin (result, mixins, rule, processMixins, opts) {
-  var name = rule.params.split(/\s/, 1)[0]
-  var rest = rule.params.slice(name.length).trim()
+function insertMixin (helpers, mixins, rule, opts) {
+  let name = rule.params.split(/\s/, 1)[0]
+  let rest = rule.params.slice(name.length).trim()
 
-  var params
+  let params
   if (rest.trim() === '') {
     params = []
   } else {
-    params = postcss.list.comma(rest)
+    params = helpers.list.comma(rest)
   }
 
-  var meta = mixins[name]
-  var mixin = meta && meta.mixin
+  let meta = mixins[name]
+  let mixin = meta && meta.mixin
 
@@ -63,4 +118,4 @@ if (!meta) {
   } else if (mixin.name === 'define-mixin') {
-    var i
-    var values = { }
+    let i
+    let values = {}
     for (i = 0; i < meta.args.length; i++) {
@@ -70,5 +125,5 @@ values[meta.args[i][0]] = params[i] || meta.args[i][1]
 
-    var proxy = postcss.root()
+    let proxy = new helpers.Root()
     for (i = 0; i < mixin.nodes.length; i++) {
-      var node = mixin.nodes[i].clone()
+      let node = mixin.nodes[i].clone()
       delete node.raws.before
@@ -79,19 +134,18 @@ proxy.append(node)
     if (meta.args.length) {
-      vars({ only: values })(proxy)
+      proxy = helpers.postcss([vars({ only: values })]).process(proxy).root
     }
 
     if (meta.content) processMixinContent(proxy, rule)
-    processMixins(proxy)
 
     rule.parent.insertBefore(rule, proxy)
   } else if (typeof mixin === 'object') {
-    insertObject(rule, mixin, processMixins)
+    insertObject(rule, mixin)
   } else if (typeof mixin === 'function') {
-    var args = [rule].concat(params)
-    rule.walkAtRules(function (atRule) {
-      insertMixin(result, mixins, atRule, processMixins, opts)
+    let args = [rule].concat(params)
+    rule.walkAtRules(atRule => {
+      insertMixin(helpers, mixins, atRule, opts)
     })
-    var nodes = mixin.apply(this, args)
+    let nodes = mixin(...args)
     if (typeof nodes === 'object') {
-      insertObject(rule, nodes, processMixins)
+      insertObject(rule, nodes)
     }
@@ -105,31 +159,4 @@ } else {
 
-function defineMixin (result, mixins, rule) {
-  var name = rule.params.split(/\s/, 1)[0]
-  var other = rule.params.slice(name.length).trim()
-
-  var args = []
-  if (other.length) {
-    args = postcss.list.comma(other).map(function (str) {
-      var arg = str.split(':', 1)[0]
-      var defaults = str.slice(arg.length + 1)
-      return [arg.slice(1).trim(), defaults.trim()]
-    })
-  }
-
-  var content = false
-  rule.walkAtRules('mixin-content', function () {
-    content = true
-    return false
-  })
-
-  mixins[name] = { mixin: rule, args: args, content: content }
-  rule.remove()
-}
-
-module.exports = postcss.plugin('postcss-mixins', function (opts) {
-  if (typeof opts === 'undefined') opts = { }
-
-  var cwd = process.cwd()
-  var globs = []
-
+module.exports = (opts = {}) => {
+  let loadFrom = []
   if (opts.mixinsDir) {
@@ -139,81 +166,42 @@ if (!Array.isArray(opts.mixinsDir)) {
     }
-    globs = opts.mixinsDir.map(function (dir) {
-      return path.join(dir, '*.{js,json,css,sss,pcss}')
-    })
+    loadFrom = opts.mixinsDir.map(dir => join(dir, '*.{js,json,css,sss,pcss}'))
   }
+  if (opts.mixinsFiles) loadFrom = loadFrom.concat(opts.mixinsFiles)
 
-  if (opts.mixinsFiles) globs = globs.concat(opts.mixinsFiles)
+  return {
+    postcssPlugin: 'postcss-mixins',
 
-  return function (css, result) {
-    var mixins = { }
+    prepare () {
+      let mixins = {}
 
-    function processMixins (root) {
-      root.walkAtRules(function (i) {
-        if (i.name === 'mixin' || i.name === 'add-mixin') {
-          if (!insideDefine(i)) {
-            insertMixin(result, mixins, i, processMixins, opts)
-          }
-        } else if (i.name === 'define-mixin') {
-          defineMixin(result, mixins, i)
-        }
-      })
-    }
-
-    function process () {
       if (typeof opts.mixins === 'object') {
-        for (var i in opts.mixins) {
+        for (let i in opts.mixins) {
           mixins[i] = { mixin: opts.mixins[i] }
         }
       }
-      processMixins(css)
-    }
 
-    if (globs.length === 0) {
-      process()
-      return
-    }
-
-    // Windows bug with { nocase: true } due to node-glob issue
-    // https://github.com/isaacs/node-glob/issues/123
-    return globby(globs, { nocase: !isWindows }).then(function (files) {
-      return Promise.all(files.map(function (file) {
-        var ext = path.extname(file).toLowerCase()
-        var name = path.basename(file, path.extname(file))
-        var relative = path.join(cwd, path.relative(cwd, file))
-        var parent = ''
-        if (opts.parent) {
-          parent = opts.parent
-        }
-        result.messages.push({
-          type: 'dependency',
-          file: relative,
-          parent: parent
-        })
-        return new Promise(function (resolve, reject) {
-          if (ext === '.css' || ext === '.pcss' || ext === '.sss') {
-            fs.readFile(relative, function (err, contents) {
-              /* istanbul ignore if */
-              if (err) {
-                reject(err)
-                return
-              }
-              var root
-              if (ext === '.sss') {
-                root = sugarss.parse(contents, { from: relative })
-              } else {
-                root = postcss.parse(contents, { from: relative })
-              }
-              root.walkAtRules('define-mixin', function (atrule) {
-                defineMixin(result, mixins, atrule)
-              })
-              resolve()
+      return {
+        Root (root, helpers) {
+          if (loadFrom.length > 0) {
+            return loadGlobalMixin(helpers, loadFrom).then(global => {
+              addGlobalMixins(helpers, mixins, global, opts.parent)
             })
-          } else {
-            mixins[name] = { mixin: require(relative) }
-            resolve()
           }
-        })
-      }))
-    }).then(process)
+        },
+        AtRule: {
+          'define-mixin': (node, helpers) => {
+            addMixin(helpers, mixins, node)
+            node.remove()
+          },
+          'mixin': (node, helpers) => {
+            insertMixin(helpers, mixins, node, opts)
+          },
+          'add-mixin': (node, helpers) => {
+            insertMixin(helpers, mixins, node, opts)
+          }
+        }
+      }
+    }
   }
-})
+}
+module.exports.postcss = true

package.json

 {
   "name": "postcss-mixins",
-  "version": "6.2.3",
+  "version": "7.0.0",
   "description": "PostCSS plugin for mixins",
@@ -15,9 +15,14 @@ "keywords": [
   "repository": "postcss/postcss-mixins",
+  "engines": {
+    "node": ">=10.0"
+  },
+  "peerDependencies": {
+    "postcss": "^8.0.3"
+  },
   "dependencies": {
-    "globby": "^8.0.1",
-    "postcss": "^7.0.21",
-    "postcss-js": "^2.0.3",
-    "postcss-simple-vars": "^5.0.2",
-    "sugarss": "^2.0.0"
+    "globby": "^11.0.1",
+    "postcss-js": "^3.0.0",
+    "postcss-simple-vars": "^6.0.0",
+    "sugarss": "^3.0.0"
   }
 }

README.md

@@ -1,6 +0,6 @@
-# PostCSS Mixins [![Build Status][ci-img]][ci]
+# PostCSS Mixins
 
 <img align="right" width="135" height="95"
      title="Philosopher’s stone, logo of PostCSS"
-     src="http://postcss.github.io/postcss/logo-leftp.svg">
+     src="https://postcss.org/logo-leftp.svg">
 
@@ -59,16 +59,36 @@ [PostCSS] plugin for mixins.
 [PostCSS]:                 https://github.com/postcss/postcss
-[ci-img]:                  https://travis-ci.org/postcss/postcss-mixins.svg
-[ci]:                      https://travis-ci.org/postcss/postcss-mixins
 
+<a href="https://evilmartians.com/?utm_source=postcss-mixins">
+  <img src="https://evilmartians.com/badges/sponsored-by-evil-martians.svg"
+       alt="Sponsored by Evil Martians" width="236" height="54">
+</a>
+
+
 ## Usage
 
-```js
-postcss([ require('postcss-mixins') ])
+**Step 1:** Install plugin:
+
+```sh
+npm install --save-dev postcss postcss-mixins
 ```
 
-See [PostCSS] docs for examples for your environment.
+**Step 2:** Check you project for existed PostCSS config: `postcss.config.js`
+in the project root, `"postcss"` section in `package.json`
+or `postcss` in bundle config.
 
-[PostCSS API]: https://github.com/postcss/postcss/blob/master/docs/api.md
+If you do not use PostCSS, add it according to [official docs]
+and set this plugin in settings.
 
+**Step 3:** Add the plugin to plugins list:
 
+```diff
+module.exports = {
+  plugins: [
++   require('postcss-mixins'),
+    require('autoprefixer')
+  ]
+}
+```
+
+
 ### CSS Mixin
@@ -203,3 +223,3 @@
 `@mixin-context` at-rule will be replaced with mixin `@mixin` children.
-For exampel, CSS mxins:
+For exampel, CSS mixins:
 
@@ -206,0 +226,0 @@ ```SCSS

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

16378

increased by0.01%

Number of lines in readme file

351

increased by6.04%

Worsened metrics

Lines of code

175

decreased by-5.91%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@nodelib/fs.scandir@2.1.5(transitive)

• + Added@nodelib/fs.stat@2.0.5(transitive)

• + Added@nodelib/fs.walk@1.2.8(transitive)

• + Addedarray-union@2.1.0(transitive)

• + Addedbraces@3.0.3(transitive)

• + Addeddir-glob@3.0.1(transitive)

• + Addedfast-glob@3.3.2(transitive)

• + Addedfastq@1.17.1(transitive)

• + Addedfill-range@7.1.1(transitive)

• + Addedglob-parent@5.1.2(transitive)

• + Addedglobby@11.1.0(transitive)

• + Addedignore@5.3.2(transitive)

• + Addedis-number@7.0.0(transitive)

• + Addedmicromatch@4.0.8(transitive)

• + Addednanoid@3.3.8(transitive)

• + Addedpath-type@4.0.0(transitive)

• + Addedpicocolors@1.1.1(transitive)

• + Addedpicomatch@2.3.1(transitive)

• + Addedpostcss@8.4.49(transitive)

• + Addedpostcss-js@3.0.3(transitive)

• + Addedpostcss-simple-vars@6.0.3(transitive)

• + Addedqueue-microtask@1.2.3(transitive)

• + Addedreusify@1.0.4(transitive)

• + Addedrun-parallel@1.2.0(transitive)

• + Addedslash@3.0.0(transitive)

• + Addedsource-map-js@1.2.1(transitive)

• + Addedsugarss@3.0.3(transitive)

• + Addedto-regex-range@5.0.1(transitive)

• - Removedpostcss@^7.0.21

• - Removed@mrmlnc/readdir-enhanced@2.2.1(transitive)

• - Removed@nodelib/fs.stat@1.1.3(transitive)

• - Removedarr-diff@4.0.0(transitive)

• - Removedarr-flatten@1.1.0(transitive)

• - Removedarr-union@3.1.0(transitive)

• - Removedarray-union@1.0.2(transitive)

• - Removedarray-uniq@1.0.3(transitive)

• - Removedarray-unique@0.3.2(transitive)

• - Removedarrify@1.0.1(transitive)

• - Removedassign-symbols@1.0.0(transitive)

• - Removedatob@2.1.2(transitive)

• - Removedbalanced-match@1.0.2(transitive)

• - Removedbase@0.11.2(transitive)

• - Removedbrace-expansion@1.1.11(transitive)

• - Removedbraces@2.3.2(transitive)

• - Removedcache-base@1.0.1(transitive)

• - Removedcall-me-maybe@1.0.2(transitive)

• - Removedclass-utils@0.3.6(transitive)

• - Removedcollection-visit@1.0.0(transitive)

• - Removedcomponent-emitter@1.3.1(transitive)

• - Removedconcat-map@0.0.1(transitive)

• - Removedcopy-descriptor@0.1.1(transitive)

• - Removeddebug@2.6.9(transitive)

• - Removeddecode-uri-component@0.2.2(transitive)

• - Removeddefine-property@0.2.51.0.02.0.2(transitive)

• - Removeddir-glob@2.0.0(transitive)

• - Removedexpand-brackets@2.1.4(transitive)

• - Removedextend-shallow@2.0.13.0.2(transitive)

• - Removedextglob@2.0.4(transitive)

• - Removedfast-glob@2.2.7(transitive)

• - Removedfill-range@4.0.0(transitive)

• - Removedfor-in@1.0.2(transitive)

• - Removedfragment-cache@0.2.1(transitive)

• - Removedfs.realpath@1.0.0(transitive)

• - Removedfunction-bind@1.1.2(transitive)

• - Removedget-value@2.0.6(transitive)

• - Removedglob@7.2.3(transitive)

• - Removedglob-parent@3.1.0(transitive)

• - Removedglob-to-regexp@0.3.0(transitive)

• - Removedglobby@8.0.2(transitive)

• - Removedhas-value@0.3.11.0.0(transitive)

• - Removedhas-values@0.1.41.0.0(transitive)

• - Removedhasown@2.0.2(transitive)

• - Removedignore@3.3.10(transitive)

• - Removedinflight@1.0.6(transitive)

• - Removedinherits@2.0.4(transitive)

• - Removedis-accessor-descriptor@1.0.1(transitive)

• - Removedis-buffer@1.1.6(transitive)

• - Removedis-data-descriptor@1.0.1(transitive)

• - Removedis-descriptor@0.1.71.0.3(transitive)

• - Removedis-extendable@0.1.11.0.1(transitive)

• - Removedis-glob@3.1.0(transitive)

• - Removedis-number@3.0.0(transitive)

• - Removedis-plain-object@2.0.4(transitive)

• - Removedis-windows@1.0.2(transitive)

• - Removedisarray@1.0.0(transitive)

• - Removedisobject@2.1.03.0.1(transitive)

• - Removedkind-of@3.2.24.0.06.0.3(transitive)

• - Removedmap-cache@0.2.2(transitive)

• - Removedmap-visit@1.0.0(transitive)

• - Removedmicromatch@3.1.10(transitive)

• - Removedminimatch@3.1.2(transitive)

• - Removedmixin-deep@1.3.2(transitive)

• - Removedms@2.0.0(transitive)

• - Removednanomatch@1.2.13(transitive)

• - Removedobject-copy@0.1.0(transitive)

• - Removedobject-visit@1.0.1(transitive)

• - Removedobject.pick@1.3.0(transitive)

• - Removedonce@1.4.0(transitive)

• - Removedpascalcase@0.1.1(transitive)

• - Removedpath-dirname@1.0.2(transitive)

• - Removedpath-is-absolute@1.0.1(transitive)

• - Removedpath-type@3.0.0(transitive)

• - Removedpicocolors@0.2.1(transitive)

• - Removedpify@3.0.0(transitive)

• - Removedposix-character-classes@0.1.1(transitive)

• - Removedpostcss@7.0.39(transitive)

• - Removedpostcss-js@2.0.3(transitive)

• - Removedpostcss-simple-vars@5.0.2(transitive)

• - Removedregex-not@1.0.2(transitive)

• - Removedrepeat-element@1.1.4(transitive)

• - Removedrepeat-string@1.6.1(transitive)

• - Removedresolve-url@0.2.1(transitive)

• - Removedret@0.1.15(transitive)

• - Removedsafe-regex@1.1.0(transitive)

• - Removedset-value@2.0.1(transitive)

• - Removedslash@1.0.0(transitive)

• - Removedsnapdragon@0.8.2(transitive)

• - Removedsnapdragon-node@2.1.1(transitive)

• - Removedsnapdragon-util@3.0.1(transitive)

• - Removedsource-map@0.5.70.6.1(transitive)

• - Removedsource-map-resolve@0.5.3(transitive)

• - Removedsource-map-url@0.4.1(transitive)

• - Removedsplit-string@3.1.0(transitive)

• - Removedstatic-extend@0.1.2(transitive)

• - Removedsugarss@2.0.0(transitive)

• - Removedto-object-path@0.3.0(transitive)

• - Removedto-regex@3.0.2(transitive)

• - Removedto-regex-range@2.1.1(transitive)

• - Removedunion-value@1.0.1(transitive)

• - Removedunset-value@1.0.0(transitive)

• - Removedurix@0.1.0(transitive)

• - Removeduse@3.1.1(transitive)

• - Removedwrappy@1.0.2(transitive)

• Updatedglobby@^11.0.1

• Updatedpostcss-js@^3.0.0

• Updatedpostcss-simple-vars@^6.0.0

• Updatedsugarss@^3.0.0