postcss-import-url - npm Package Compare versions

Comparing version 4.0.0 to 5.0.0

CHANGELOG.md

@@ -0,1 +1,18 @@
+# [5.0.0](https://github.com/unlight/postcss-import-url/compare/v4.0.0...v5.0.0) (2020-03-01)
+
+
+### chore
+
+* Added development stuff (prettier, eslint, etc.) ([70e5497](https://github.com/unlight/postcss-import-url/commit/70e5497a750dd7e7935ed4f08fde76f30b69b955))
+
+
+### Features
+
+* Resolve relative URLs in property values ([c11c03d](https://github.com/unlight/postcss-import-url/commit/c11c03d10f8d5016d4cec811f40fed6f6140e6f1))
+
+
+### BREAKING CHANGES
+
+* Node 10+ is required
+
 # [4.0.0](https://github.com/unlight/postcss-import-url/compare/v3.0.4...v4.0.0) (2019-01-03)
@@ -2,0 +19,0 @@

index.js

@@ -1,87 +0,104 @@
-var postcss = require("postcss");
-var hh = require("http-https");
-var isUrl = require("is-url");
-var trim = require("lodash.trim");
-var resolveRelative = require("resolve-relative-url");
-var assign = require("lodash.assign");
+var postcss = require('postcss');
+var hh = require('http-https');
+var isUrl = require('is-url');
+var trim = require('lodash.trim');
+var resolveRelative = require('resolve-relative-url');
+var assign = require('lodash.assign');
 var defaults = {
-	recursive: true,
-	modernBrowser: false,
-	userAgent: null
+    recursive: true,
+    resolveURLs: false,
+    modernBrowser: false,
+    userAgent: null,
 };
 var space = postcss.list.space;
 var url = require('url');
+var urlRegexp = /url\(["'].+?['"]\)/;
 
 function postcssImportUrl(options) {
-	options = assign({}, defaults, options || {});
-	return function importUrl(tree, dummy, parentRemoteFile) {
-		parentRemoteFile = parentRemoteFile || tree.source.input.file;
-		var imports = [];
-		tree.walkAtRules("import", function checkAtRule(atRule) {
-			var params = space(atRule.params);
-			var remoteFile = cleanupRemoteFile(params[0]);
-			if (parentRemoteFile) {
-				remoteFile = resolveRelative(remoteFile, parentRemoteFile);
-			}
-			if (!isUrl(remoteFile)) return;
-			imports[imports.length] = createPromise(remoteFile, options).then(function(r) {
-				var newNode = postcss.parse(r.body);
-				var mediaQueries = params.slice(1).join(" ");
-				if (mediaQueries) {
-					var mediaNode = postcss.atRule({
-						name: "media",
-						params: mediaQueries
-					});
-					mediaNode.append(newNode);
-					newNode = mediaNode;
-				}
-				var p = (options.recursive) ? importUrl(newNode, null, r.parent) : Promise.resolve(newNode);
-				return p.then(function(tree) {
-					atRule.replaceWith(tree);
-				});
-			});
-		});
-		return Promise.all(imports).then(function() {
-			return tree;
-		});
-	};
+    options = assign({}, defaults, options || {});
+    return function importUrl(tree, dummy, parentRemoteFile) {
+        parentRemoteFile = parentRemoteFile || tree.source.input.file;
+        var imports = [];
+        tree.walkAtRules('import', function checkAtRule(atRule) {
+            var params = space(atRule.params);
+            var remoteFile = cleanupRemoteFile(params[0]);
+            if (parentRemoteFile) {
+                remoteFile = resolveRelative(remoteFile, parentRemoteFile);
+            }
+            if (!isUrl(remoteFile)) return;
+            imports[imports.length] = createPromise(remoteFile, options).then(function(r) {
+                var newNode = postcss.parse(r.body);
+                var mediaQueries = params.slice(1).join(' ');
+                if (mediaQueries) {
+                    var mediaNode = postcss.atRule({
+                        name: 'media',
+                        params: mediaQueries,
+                    });
+                    mediaNode.append(newNode);
+                    newNode = mediaNode;
+                }
+
+                if (options.resolveUrls) {
+                    // Convert relative paths to absolute paths
+                    newNode = newNode.replaceValues(urlRegexp, { fast: 'url(' }, function(url) {
+                        return resolveUrls(url, remoteFile);
+                    });
+                }
+
+                var p = options.recursive
+                    ? importUrl(newNode, null, r.parent)
+                    : Promise.resolve(newNode);
+                return p.then(function(tree) {
+                    atRule.replaceWith(tree);
+                });
+            });
+        });
+        return Promise.all(imports).then(function() {
+            return tree;
+        });
+    };
 }
 
-module.exports = postcss.plugin("postcss-import-url", postcssImportUrl);
+module.exports = postcss.plugin('postcss-import-url', postcssImportUrl);
 
 function cleanupRemoteFile(value) {
-	if (value.substr(0, 3) === "url") {
-		value = value.substr(3);
-	}
-	value = trim(value, "'\"()");
-	return value;
+    if (value.substr(0, 3) === 'url') {
+        value = value.substr(3);
+    }
+    value = trim(value, '\'"()');
+    return value;
 }
 
+function resolveUrls(to, from) {
+    return 'url("' + resolveRelative(cleanupRemoteFile(to), from) + '")';
+}
+
 function createPromise(remoteFile, options) {
-	var reqOptions = url.parse(remoteFile);
-	reqOptions.headers = {};
-	reqOptions.headers['connection'] = 'keep-alive';
-	if (options.modernBrowser) {
-		reqOptions.headers['user-agent'] = 'Mozilla/5.0 AppleWebKit/538.0 Chrome/65.0.0.0 Safari/538';
-	}
-	if (options.userAgent) {
-		reqOptions.headers['user-agent'] = String(options.userAgent);
-	}
-	function executor(resolve, reject) {
-		var request = hh.get(reqOptions, function(response) {
-			var body = "";
-			response.on("data", function(chunk) {
-				body += chunk.toString();
-			});
-			response.on("end", function() {
-				resolve({
-					body: body,
-					parent: remoteFile
-				});
-			});
-		});
-		request.on("error", reject);
-		request.end();
-	}
-	return new Promise(executor);
+    var reqOptions = url.parse(remoteFile);
+    reqOptions.headers = {};
+    reqOptions.headers['connection'] = 'keep-alive';
+    if (options.modernBrowser) {
+        reqOptions.headers['user-agent'] =
+            'Mozilla/5.0 AppleWebKit/538.0 Chrome/65.0.0.0 Safari/538';
+    }
+    if (options.userAgent) {
+        reqOptions.headers['user-agent'] = String(options.userAgent);
+    }
+    function executor(resolve, reject) {
+        var request = hh.get(reqOptions, function(response) {
+            var body = '';
+            response.on('data', function(chunk) {
+                body += chunk.toString();
+            });
+            response.on('end', function() {
+                resolve({
+                    body: body,
+                    parent: remoteFile,
+                });
+            });
+        });
+        request.on('error', reject);
+        request.end();
+    }
+    return new Promise(executor);
 }

package.json

 {
   "name": "postcss-import-url",
-  "version": "4.0.0",
+  "version": "5.0.0",
   "description": "PostCSS plugin inlines remote files.",
@@ -13,4 +13,3 @@ "keywords": [
   "engines": {
-    "node": ">=6",
-    "npm": ">=3"
+    "node": ">=10"
   },
@@ -27,17 +26,20 @@ "dependencies": {
   },
-  "_devDependencies": {
+  "devDependencies": {
+    "@semantic-release/changelog": "^5.0.0",
+    "postcss": ">=6 <8",
+    "@semantic-release/git": "^9.0.0",
     "chai": "^4.2.0",
-    "gulp": "^4.0.0",
-    "@semantic-release/changelog": "^3.0.2",
-    "@semantic-release/git": "^7.0.7",
-    "@semantic-release/npm": "^5.1.3",
-    "semantic-release": "^15.13.2",
+    "gulp": "^4.0.2",
     "gulp-connect": "^5.7.0",
-    "gulp-eslint": "^5.0.0",
-    "gulp-mocha": "^6.0.0",
+    "gulp-eslint": "^6.0.0",
+    "gulp-mocha": "^7.0.2",
+    "husky": "^4.2.3",
+    "precise-commits": "^1.0.2",
+    "prettier": "^1.19.1",
+    "semantic-release": "^17.0.4",
     "tcp-ping": "^0.1.1"
   },
   "scripts": {
-    "prepublishOnly": "sed -i -e 's/_devDependencies/__devDependencies/g' package.json",
-    "pretest": "npm install postcss@7 --no-package-lock --no-save",
+    "eslint": "node node_modules/eslint/bin/eslint index.js",
+    "eslint:fix": "npm run eslint -- --fix",
     "test": "gulp"
@@ -56,30 +58,7 @@ },
   },
-  "release": {
-    "verifyConditions": [
-      "@semantic-release/changelog",
-      "@semantic-release/github",
-      "@semantic-release/npm",
-      "@semantic-release/git"
-    ],
-    "prepare": [
-      "@semantic-release/changelog",
-      "@semantic-release/npm",
-      "@semantic-release/git"
-    ],
-    "publish": [
-      "@semantic-release/npm",
-      "@semantic-release/github"
-    ],
-    "success": [
-      "@semantic-release/github"
-    ],
-    "fail": [
-      "@semantic-release/github"
-    ]
-  },
-  "config": {
-    "commitizen": {
-      "path": "cz-conventional-changelog"
+  "husky": {
+    "hooks": {
+      "pre-commit": "precise-commits"
     }
   }
 }

README.md

 # postcss-import-url
+
 [PostCSS](https://github.com/postcss/postcss) plugin inlines remote files.
@@ -6,5 +7,5 @@
 /* Input example */
-@import "http://fonts.googleapis.com/css?family=Tangerine";
+@import 'https://fonts.googleapis.com/css?family=Tangerine';
 body {
-	font-size: 13px;
+    font-size: 13px;
 }
@@ -19,8 +20,11 @@ ```
     font-weight: 400;
-    src: local('Tangerine'), url(http://fonts.gstatic.com/s/tangerine/v7/HGfsyCL5WASpHOFnouG-RKCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
+    src: local('Tangerine'),
+        url(https://fonts.gstatic.com/s/tangerine/v7/HGfsyCL5WASpHOFnouG-RKCWcynf_cDxXwCLxiixG1c.ttf)
+            format('truetype');
 }
 body {
-	font-size: 13px;
+    font-size: 13px;
 }
 ```
+
 ## Usage
@@ -31,7 +35,6 @@
 var options = {};
-postcss([importUrl(options)])
-    .process(css, {
-        // Define a `from` option to resolve relative @imports in the initial css to a url.
-        from: 'http://example.com/styles.css',
-    });
+postcss([importUrl(options)]).process(css, {
+    // Define a `from` option to resolve relative @imports in the initial css to a url.
+    from: 'https://example.com/styles.css',
+});
 ```
@@ -42,12 +45,16 @@
 ## Options
-* `recursive` (boolean) To import URLs recursively (default: `true`)
-* `modernBrowser` (boolean) set user-agent string to 'Mozilla/5.0 AppleWebKit/537.36 Chrome/65.0.0.0 Safari/537.36', this option maybe useful for importing fonts from Google. Google check `user-agent` header string and respond can be different (default: `false`)
-* `userAgent` (string) Custom user-agent header (default: `null`)
 
+-   `recursive` (boolean) To import URLs recursively (default: `true`)
+-   `resolveUrls` (boolean) To transform relative URLs found in remote stylesheets into fully qualified URLs ([see #18](https://github.com/unlight/postcss-import-url/pull/18)) (default: `false`)
+-   `modernBrowser` (boolean) Set user-agent string to 'Mozilla/5.0 AppleWebKit/537.36 Chrome/65.0.0.0 Safari/537.36', this option maybe useful for importing fonts from Google. Google check `user-agent` header string and respond can be different (default: `false`)
+-   `userAgent` (string) Custom user-agent header (default: `null`)
+
 ## Known Issues
-* Google fonts returns different file types per the user agent. Because postcss runs in a shell,
-Google returns truetype fonts rather than the better woff2 format.
-Use option `modernBrowser` to explicitly load woff2 fonts.
 
+-   Google fonts returns different file types per the user agent. Because postcss runs in a shell,
+    Google returns truetype fonts rather than the better woff2 format.
+    Use option `modernBrowser` to explicitly load woff2 fonts.
+
 ## Changelog
-See [CHANGELOG](CHANGELOG.md)
+
+See [CHANGELOG](CHANGELOG.md)

New alerts

Network access

Supply chain risk

This module accesses the network.

Found 1 instance in 1 package

Fixed alerts

Network access

Supply chain risk

This module accesses the network.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

10713

increased by32.57%

Number of package files

9

increased by80%

Lines of code

149

increased by79.52%

Number of lines in readme file

57

increased by16.33%

Worsened metrics

Dev dependency count

13

increased byInfinity%

No dependency changes