The relateurl npm package is designed to simplify the process of converting absolute URLs to relative URLs, based on the current page's URL. It can be particularly useful in web development scenarios where you need to optimize link references within your site or application.
Convert absolute URL to relative URL
This feature allows you to convert an absolute URL to a relative URL based on a base URL. It's useful for reducing the length of URLs in your HTML or CSS files.
"const RelateUrl = require('relateurl');\nconst absoluteUrl = 'http://example.com/dir/file';\nconst options = { output: RelateUrl.SHORTEST };\nconst relativeUrl = RelateUrl.relate('http://example.com/', absoluteUrl, options);\nconsole.log(relativeUrl); // Outputs: 'dir/file'"Customize output with options
This feature demonstrates how you can customize the output of the relative URL using various options, such as making it scheme-relative or choosing the type of relative path.
"const RelateUrl = require('relateurl');\nconst absoluteUrl = 'https://example.com/dir/file';\nconst options = {\n output: RelateUrl.PATH_RELATIVE,\n schemeRelative: true\n};\nconst relativeUrl = RelateUrl.relate('https://example.com/another-dir/', absoluteUrl, options);\nconsole.log(relativeUrl); // Outputs: '../../dir/file'"Similar to relateurl, url-relative is a package that provides functionalities for converting absolute URLs to relative URLs. However, it might offer a different API or additional/different options for customization.
URI.js is a more comprehensive URL manipulation library that includes the ability to resolve relative paths, but it also offers a wide range of other URL manipulation features. It's more versatile than relateurl but might be overkill for simple relative URL conversions.
Minify URLs by converting them from absolute to relative.
If you were to use this library on a website like http://example.com/dir1/dir1-1/, you would get results such as:
| Before | After |
|---|---|
http://example.com/dir1/dir1-2/index.html | ../dir1-2/ |
http://example.com/dir2/dir2-1/ | /dir2/dir2-1/ |
http://example.com/dir1/dir1-1/ | |
https://example.com/dir1/dir1-1/ | https://example.com/dir1/dir1-1/ |
http://google.com:80/dir/ | //google.com/dir/ |
../../../../../../../../#anchor | /#anchor |
All string parsing. No directory browsing. It is thoroughly tested, very fast and lightweight with zero external dependencies.
This utility requires Node.js >= 0.10. To install, type this at the command line:
npm install relateurl --save-dev
Type: Object
Default value: {ftp:21, http:80, https:443}
Extend the list with any ports you need. Any URLs containing these default ports will have them removed. Example: http://example.com:80/ will become http://example.com/.
Type: Array
Default value: ["index.html"]
Extend the list with any resources you need. Works with options.removeDirectoryIndexes.
Type: Boolean
Default value: false
This will, for example, consider any domains containing http://www.example.com/ to be related to any that contain http://example.com/.
Type: constant or String
Choices: RelateUrl.ABSOLUTE,RelateUrl.PATH_RELATIVE,RelateUrl.ROOT_RELATIVE,RelateUrl.SHORTEST
Choices: "absolute","pathRelative","rootRelative","shortest"
Default value: RelateUrl.SHORTEST
RelateUrl.ABSOLUTE will produce an absolute URL. Overrides options.schemeRelative with a value of false.
RelateUrl.PATH_RELATIVE will produce something like ../child-of-parent/etc/.
RelateUrl.ROOT_RELATIVE will produce something like /child-of-root/etc/.
RelateUrl.SHORTEST will choose whichever is shortest between root- and path-relative.
Type: Array
Default value: ["data","javascript","mailto"]
Extend the list with any additional schemes. Example: javascript:something will not be modified.
Type: Boolean
Default value: false
Remove user authentication information from the output URL.
Type: Boolean
Default value: true
Remove any resources that match any found in options.directoryIndexes.
Type: Boolean
Default value: false
Remove empty query variables. Example: http://domain.com/?var1&var2=&var3=asdf will become http://domain.com/?var3=adsf. This does not apply to unrelated URLs (with other protocols, auths, hosts and/or ports).
Type: Boolean
Default value: true
Remove trailing slashes from root paths. Example: http://domain.com/?var will become http://domain.com?var while http://domain.com/dir/?var will not be modified.
Type: Boolean
Default value: true
Output URLs relative to the scheme. Example: http://example.com/ will become //example.com/.
Type: String
Default value: undefined
An options-based version of the from argument. If both are specified, from takes priority.
Type: Boolean
Default value: true
Passed to Node's url.parse.
This library can be used as a function for single-use or as a class for multiple conversions.
Upon successful conversion, a String will be returned. If an issue is encountered while parsing from, an error will be thrown.
var RelateUrl = require("relateurl");
var result = RelateUrl.relate(from, to, options);
var RelateUrl = require("relateurl");
var instance = new RelateUrl(from, options);
var result1 = instance.relate(to1);
var result2 = instance.relate(to2, customOptions);
var result3 = instance.relate(to3);
Why bother writing/using this?
To aid in further minifying HTML, mainly for the purpose of faster page loads and SEO. It's been integrated into HTMLMinifier.
Why not just use Node's url.parse, url.resolve and path.relative?
url.parse is used, but url.resolve and path.relative are both slower and less powerful than this library.
options.removeRootTrailingSlashoptions.siteoptions.removeEmptyQueries=true only applied to unrelated URLstel:options.slashesDenoteHost=false, add something like options.externalDirectoryIndexes=[] for external sitesFAQs
Minify URLs by converting them from absolute to relative.
The npm package relateurl receives a total of 9,337,283 weekly downloads. As such, relateurl popularity was classified as popular.
We found that relateurl demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.
Security News
The Ultralytics' PyPI Package was compromised four times in one weekend through GitHub Actions cache poisoning and failure to rotate previously compromised API tokens.