postcss-assets - npm Package Compare versions

Comparing version 5.0.0 to 6.0.0

CHANGELOG.md

 # Change log
 
+## 6.0.0
+
+**Breaking**
+
+- Updates to PostCSS 8 (https://github.com/borodean/postcss-assets/issues/86, https://github.com/borodean/postcss-assets/pull/87)
+- Drops nodejs <10 support.
+
+**Under the hook**
+
+- Minor documentation tweaks (https://github.com/borodean/postcss-assets/pull/78, https://github.com/borodean/postcss-assets/pull/84)
+
 ## 5.0.0
+
 **Breaking**
@@ -10,22 +22,28 @@
 ## 4.2.0
+
 **Features:**
 
-* Add `cache` option to cache resolved dimensions (https://github.com/borodean/postcss-assets/pull/73).
+- Add `cache` option to cache resolved dimensions (https://github.com/borodean/postcss-assets/pull/73).
 
 ## 4.1.0
+
 **Features:**
 
-* `relative` option supports what `relativeTo` option did in 3.x: if a string is passed, paths are generated relatively to a path in that string. A behavior of relating to input files by passing `true` is kept untouched.
+- `relative` option supports what `relativeTo` option did in 3.x: if a string is passed, paths are generated relatively to a path in that string. A behavior of relating to input files by passing `true` is kept untouched.
 
 **Under the hood:**
 
-* Code updated to match [Airbnb code style](https://github.com/airbnb/javascript).
-* Tests converted to ES6 syntax.
+- Code updated to match [Airbnb code style](https://github.com/airbnb/javascript).
+- Tests converted to ES6 syntax.
 
 ## 4.0.1
+
 **Bugfixes**
+
 - Works fine with no options provided (https://github.com/assetsjs/postcss-assets/issues/45).
 
 ## 4.0.0
+
 **Breaking**
+
 - Removes `relativeTo` option, introduces `relative` one.
@@ -40,6 +58,7 @@
 **Features**
+
 - Load paths now accept globs:
 
   ```js
-  var options = { loadPaths: ['images', 'assets/**/img'] };
+  var options = { loadPaths: ["images", "assets/**/img"] };
   ```
@@ -52,6 +71,7 @@
   ```js
-  var options = { loadPaths: 'assets/**/img' };
+  var options = { loadPaths: "assets/**/img" };
   ```
 
 **Bugfixes**
+
 - Really fixes the SVG rendering on Internet Explorer.
@@ -63,2 +83,3 @@ - SCSS flags are preserved (https://github.com/assetsjs/postcss-assets/issues/43).
 **Under the hood**
+
 - Coverage hits 100%.
@@ -74,3 +95,5 @@ - Automated tests against the latest stable nodejs, v0.12 and v4.
 ## 3.0.3
+
 **Bugfixes**
+
 - no longer uses private `image-size` fork, so properly installs on Windows (https://github.com/borodean/postcss-assets/pull/30, https://github.com/borodean/postcss-assets/issues/32);
@@ -80,37 +103,53 @@ - properly calculates dimensions of SVGs with percentage values of `width`/`height` attributes (https://github.com/borodean/postcss-assets/issues/33).
 ## 3.0.2
+
 **Bugfixes**
-* IE understands generated SVG (https://github.com/borodean/postcss-assets/issues/24).
 
+- IE understands generated SVG (https://github.com/borodean/postcss-assets/issues/24).
+
 ## 3.0.1
+
 **Bugfixes**
+
 - Preserves Microsoft filters (https://github.com/borodean/postcss-assets/issues/27).
 
 **Under the hood**
+
 - Uses ESLint instead of JSHint/JSCS.
 
 ## 3.0.0
+
 **API updates**
-* better PostCSS 5.0 API conformance (https://github.com/borodean/postcss-assets/issues/25).
 
+- better PostCSS 5.0 API conformance (https://github.com/borodean/postcss-assets/issues/25).
+
 ## 2.1.4
+
 Since private `image-size` fork was removed, releases 2.1.0—3.0.2 has stopped working. While 3.0.3 release fixes this for the 3.0.x versions, this release is fixing the same for the 2.1.x.
 
 **Bugfixes**
+
 - no longer uses private `image-size` fork (https://github.com/borodean/postcss-assets/issues/37)
 
 ## 2.1.3
+
 **Bugfixes**
+
 - better PostCSS plugin API conformance (https://github.com/borodean/postcss-assets/pull/21). This allows plugin to be used with Webpack.
 
 ## 2.1.2
+
 **Under the hood**
-* [PostCSS Plugin Guidelines](https://github.com/postcss/postcss/blob/master/docs/guidelines/plugin.md) conformance (https://github.com/borodean/postcss-assets/issues/20);
-* continious integration tests on both Node.js and io.js;
-* shows coverage statistics on the repository page.
 
+- [PostCSS Plugin Guidelines](https://github.com/postcss/postcss/blob/master/docs/guidelines/plugin.md) conformance (https://github.com/borodean/postcss-assets/issues/20);
+- continious integration tests on both Node.js and io.js;
+- shows coverage statistics on the repository page.
+
 ## 2.1.1
+
 **Bugfixes**
+
 - fix path separator handling on Windows (https://github.com/borodean/postcss-assets/issues/19).
 
 **Under the hood**
+
 - covers 99% of the code;
@@ -120,6 +159,9 @@ - explains code with comments.
 ## 2.1.0
+
 **API updates**
+
 - extends cachebuster to support modifying the filename (https://github.com/borodean/postcss-assets/pull/17, [docs](https://github.com/borodean/postcss-assets#cachebuster)).
 
 **Bugfixes**
+
 - uses [forked version of image-size](https://github.com/borodean/image-size) to support viewbox-only svgs;
@@ -129,2 +171,3 @@ - properly encodes some tricky SVG files (https://github.com/borodean/postcss-assets/pull/18).
 **Under the hood**
+
 - uses [Gulp](http://gulpjs.com/) for development routines;
@@ -134,3 +177,5 @@ - validates code style with [JSHint](http://jshint.com/) and [JSCS](http://jscs.info/).
 ## 2.0.0
+
 **API updates**
+
 - Renames `url()` function to `resolve()` https://github.com/borodean/postcss-assets/issues/13
@@ -142,2 +187,3 @@ - Resolves assets relative to the source file https://github.com/borodean/postcss-assets/issues/7
 **Under the hood**
+
 - Tests with Mocha/Chai instead of Tape https://github.com/borodean/postcss-assets/issues/12
@@ -147,2 +193,3 @@ - Updates dependencies upto the latest versions
 ## 1.1.4
+
 Allows to use common PostCSS plugin API (https://github.com/borodean/postcss-assets/issues/6)
@@ -152,26 +199,33 @@ Fixes quotes when inlining SVG (https://github.com/borodean/postcss-assets/pull/14)
 ## 1.1.3
+
 Base64-encodes with Buffer.
 
 ## 1.1.2
+
 Cachebuster recognizes resolved paths.
 
 ## 1.1.1
+
 Uses PostCSS 4.0.
 
 ## 1.1.0
+
 Introduces [cachebuster](https://github.com/borodean/postcss-assets#cachebuster).
 
 ## 1.0.0
-* [`width`, `height` and `size` functions][1] are introduced to measure image dimesions with high density pixels support;
-* [`inline` function][2] introduced to inline files;
-* `url` function automagic is removed;
-* `inline.maxSize` option is removed;
-* all modifiers are removed.
-[1]: https://github.com/borodean/postcss-assets/tree/3168ab2b07cf537240ecc20e0eb7688434987614#image-dimensions
-[2]: https://github.com/borodean/postcss-assets/tree/3168ab2b07cf537240ecc20e0eb7688434987614#inlining-files
 
+- [`width`, `height` and `size` functions][1] are introduced to measure image dimesions with high density pixels support;
+- [`inline` function][2] introduced to inline files;
+- `url` function automagic is removed;
+- `inline.maxSize` option is removed;
+- all modifiers are removed.
+  [1]: https://github.com/borodean/postcss-assets/tree/3168ab2b07cf537240ecc20e0eb7688434987614#image-dimensions
+  [2]: https://github.com/borodean/postcss-assets/tree/3168ab2b07cf537240ecc20e0eb7688434987614#inlining-files
+
 ## 0.9.1
+
 Inlines SVG as UTF-8, not Base64.
 
 ## 0.9.0
+
 Hello, world.

lib/__utils__/generateFileUniqueId.js

@@ -1,6 +0,6 @@
-var fs = require('fs');
+const fs = require('fs');
 
 module.exports = function generateFileUniqueId(resolvedPath) {
-  var mtime = fs.statSync(resolvedPath).mtime;
+  const { mtime } = fs.statSync(resolvedPath);
   return mtime.getTime().toString(16);
 };

lib/index.js

@@ -1,13 +0,11 @@
-var Assets = require('assets');
-var dirname = require('path').dirname;
-var functions = require('postcss-functions');
-var postcss = require('postcss');
-var quote = require('./quote');
-var unescapeCss = require('./unescape-css');
-var unquote = require('./unquote');
-var util = require('util');
-var Promise = require('bluebird');
-var generateFileUniqueId = require('./__utils__/generateFileUniqueId');
+const Assets = require('assets');
+const { dirname } = require('path');
+const functions = require('postcss-functions');
+const util = require('util');
+const quote = require('./quote');
+const unescapeCss = require('./unescape-css');
+const unquote = require('./unquote');
+const generateFileUniqueId = require('./__utils__/generateFileUniqueId');
 
-var cachedDimensions = {};
+const cachedDimensions = {};
 
@@ -30,18 +28,15 @@ function formatUrl(url) {
 
-function plugin(options) {
-  var params = options || {};
-  var resolver;
-
+module.exports = (params = {}) => {
   if (params.relative === undefined) {
-    params.relative = false;
+    params.relative = false; // eslint-disable-line no-param-reassign
   }
 
-  resolver = new Assets(options);
+  const resolver = new Assets(params);
 
   function measure(path, density) {
-    var cached = null;
-    var id = '';
-    var getSizePromise = null;
+    let cached = null;
+    let id = '';
+    let getSizePromise = null;
 
-    return resolver.path(path).then(function measureSize(resolvedPath) {
+    return resolver.path(path).then((resolvedPath) => {
       if (params.cache) {
@@ -55,3 +50,3 @@ cached = cachedDimensions[resolvedPath];
       } else {
-        getSizePromise = resolver.size(path).then(function cacheSize(size) {
+        getSizePromise = resolver.size(path).then((size) => {
           if (params.cache && id) {
@@ -65,7 +60,7 @@ cachedDimensions[resolvedPath] = {};
 
-      return getSizePromise.then(function correctDensity(size) {
+      return getSizePromise.then((size) => {
         if (density !== undefined) {
           return {
             width: Number((size.width / density).toFixed(4)),
-            height: Number((size.height / density).toFixed(4))
+            height: Number((size.height / density).toFixed(4)),
           };
@@ -78,47 +73,50 @@ }
 
-  return postcss()
-    .use(function appendInputDir(css) {
-      var inputDir;
-
-      if (css.source.input.file) {
-        inputDir = dirname(css.source.input.file);
-
-        resolver.options.loadPaths = resolver.options.loadPaths || [];
-        resolver.options.loadPaths.unshift(inputDir);
-
-        if (params.relative === true) {
-          resolver.options.relativeTo = inputDir;
-        }
-      }
-
-      if (typeof params.relative === 'string') {
-        resolver.options.relativeTo = params.relative;
-      }
-    })
-    .use(functions({
+  return {
+    // Initialize functions plugin as if it was this plugin
+    ...functions({
       functions: {
         resolve: function resolve(path) {
-          var normalizedPath = unquote(unescapeCss(path));
+          const normalizedPath = unquote(unescapeCss(path));
           return resolver.url(normalizedPath).then(formatUrl);
         },
         inline: function inline(path) {
-          var normalizedPath = unquote(unescapeCss(path));
+          const normalizedPath = unquote(unescapeCss(path));
           return resolver.data(normalizedPath).then(formatUrl);
         },
         size: function size(path, density) {
-          var normalizedPath = unquote(unescapeCss(path));
+          const normalizedPath = unquote(unescapeCss(path));
           return measure(normalizedPath, density).then(formatSize);
         },
         width: function width(path, density) {
-          var normalizedPath = unquote(unescapeCss(path));
+          const normalizedPath = unquote(unescapeCss(path));
           return measure(normalizedPath, density).then(formatWidth);
         },
         height: function height(path, density) {
-          var normalizedPath = unquote(unescapeCss(path));
+          const normalizedPath = unquote(unescapeCss(path));
           return measure(normalizedPath, density).then(formatHeight);
+        },
+      },
+    }),
+    // Override with our own features and name
+    postcssPlugin: 'postcss-assets',
+    Once(root) {
+      let inputDir;
+      if (root.source.input.file) {
+        inputDir = dirname(root.source.input.file);
+
+        resolver.options.loadPaths = resolver.options.loadPaths || [];
+        resolver.options.loadPaths.unshift(inputDir);
+
+        if (params.relative === true) {
+          resolver.options.relativeTo = inputDir;
         }
       }
-    }));
-}
 
-module.exports = postcss.plugin('postcss-assets', plugin);
+      if (typeof params.relative === 'string') {
+        resolver.options.relativeTo = params.relative;
+      }
+    },
+  };
+};
+
+module.exports.postcss = true;

lib/quote.js

 /* eslint quotes: 0 */
 
-var util = require('util');
+const util = require('util');
 
-var R_QUOTES = /'/g;
+const R_QUOTES = /'/g;
 
@@ -11,3 +11,3 @@ function escapeQuote(match, offset, string) {
   }
-  return '\\' + match;
+  return `\\${match}`;
 }
@@ -14,0 +14,0 @@

lib/unescape-css.js

@@ -1,2 +0,2 @@
-var R_ESCAPE = /\\(?:([0-9a-f]{1,6} ?)|(.))/gi;
+const R_ESCAPE = /\\(?:([0-9a-f]{1,6} ?)|(.))/gi;
 
@@ -3,0 +3,0 @@ function unescapeSequence(match, hex, char) {

package.json

 {
   "name": "postcss-assets",
-  "version": "5.0.0",
+  "version": "6.0.0",
   "description": "PostCSS plugin to manage assets",
@@ -31,21 +31,23 @@ "keywords": [
     "coveralls": "nyc report --reporter=text-lcov | coveralls",
-    "test": "eslint --ignore-path .gitignore . && nyc --reporter=text --reporter=html ./node_modules/ava/cli.js"
+    "test": "eslint --ignore-path .gitignore . && nyc --reporter=text --reporter=html ava"
   },
   "dependencies": {
     "assets": "^3.0.0",
-    "bluebird": "^3.5.0",
-    "postcss": "^6.0.10",
-    "postcss-functions": "^3.0.0"
+    "postcss-functions": "^4.0.2"
   },
   "devDependencies": {
-    "ava": "^0.22.0",
-    "coveralls": "^2.11.13",
-    "eslint": "^4.5.0",
-    "eslint-config-airbnb-base": "^11.3.2",
+    "ava": "^3.15.0",
+    "coveralls": "^3.1.0",
+    "eslint": "^7.26.0",
+    "eslint-config-airbnb-base": "^14.2.1",
     "eslint-plugin-import": "^2.7.0",
-    "nyc": "^11.1.0"
+    "nyc": "^15.1.0",
+    "postcss": "^8.2.15"
   },
+  "peerDependencies": {
+    "postcss": "^8.2.15"
+  },
   "engines": {
-    "node": ">=0.12"
+    "node": ">=10"
   }
 }

README.md

@@ -1,2 +0,2 @@
-# ![postcss-assets](https://rawgit.com/assetsjs/postcss-assets/develop/media/postcss-assets.svg)
+# ![postcss-assets](https://cdn.jsdelivr.net/gh/borodean/postcss-assets@master/media/postcss-assets.svg)
 
@@ -7,8 +7,8 @@ PostCSS Assets is an asset manager for CSS. It isolates stylesheets from environmental changes, gets image sizes and inlines files.
 
-[appveyor]:        https://ci.appveyor.com/project/borodean/postcss-assets
-[appveyor-badge]:  https://img.shields.io/appveyor/ci/borodean/postcss-assets.svg?label=windows
-[coveralls]:       https://coveralls.io/github/assetsjs/postcss-assets
-[coveralls-badge]: https://img.shields.io/coveralls/assetsjs/postcss-assets.svg
-[travis]:          https://travis-ci.org/assetsjs/postcss-assets
-[travis-badge]:    https://img.shields.io/travis/assetsjs/postcss-assets.svg?label=unix
+[appveyor]:        https://ci.appveyor.com/project/borodean/postcss-assets/branch/master
+[appveyor-badge]:  https://img.shields.io/appveyor/build/borodean/postcss-assets/master?label=windows
+[coveralls]:       https://coveralls.io/github/borodean/postcss-assets
+[coveralls-badge]: https://img.shields.io/coveralls/github/borodean/postcss-assets/master
+[travis]:          https://travis-ci.org/borodean/postcss-assets
+[travis-badge]:    https://img.shields.io/travis/borodean/postcss-assets/master?label=unix
 
@@ -152,3 +152,3 @@ Table of contents
 
-PostCSS Assets can bust assets cache, changing urls depending on asset’s modification date:
+PostCSS Assets can bust assets cache:
 
@@ -161,4 +161,14 @@ ```js
 
+Example:
+
 ```css
 body {
+  background: resolve('/images/icons/baz.png');
+}
+```
+
+PostCSS Assets will change urls depending on asset’s modification date:
+
+```css
+body {
   background: url('/images/icons/baz.png?14a931c501f');
@@ -165,0 +175,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

20733

increased by2.71%

Dependency count

3

decreased by-25%

Number of lines in readme file

256

increased by4.07%

Worsened metrics

Dev dependency count

7

increased by16.67%

Dependency changes

• + Addednanoid@3.3.7(transitive)

• + Addedpicocolors@1.0.1(transitive)

• + Addedpostcss@8.4.38(transitive)

• + Addedpostcss-functions@4.0.2(transitive)

• + Addedpostcss-value-parser@4.2.0(transitive)

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

• - Removedbluebird@^3.5.0

• - Removedpostcss@^6.0.10

• - Removedansi-styles@3.2.1(transitive)

• - Removedchalk@2.4.2(transitive)

• - Removedcolor-convert@1.9.3(transitive)

• - Removedcolor-name@1.1.3(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• - Removedhas-flag@3.0.0(transitive)

• - Removedobject-assign@4.1.1(transitive)

• - Removedpostcss@6.0.23(transitive)

• - Removedpostcss-functions@3.0.0(transitive)

• - Removedpostcss-value-parser@3.3.1(transitive)

• - Removedsource-map@0.6.1(transitive)

• - Removedsupports-color@5.5.0(transitive)

• Updatedpostcss-functions@^4.0.2