hash-web
v1.2.1
Published
A script that appends hashes to filenames, import paths, and any other links for your web project.
Downloads
318
Readme
HASH-WEB
A script that appends hashes to filenames, import paths, and any other links that connect the resources within your entire web project.
How does it work?
The script requires an HTML entry point to begin. It scans the page for links specifically
those with src=""
or href=""
, and follow these links to subsequent files. For each files,
depending on its content type (e.g, .js, .css) the script performs an additional scan to identify and
track any further links to other resources. For example, when processing a JS file, the script looks
for patterns such as import
, fetch
, request
, and url
.
As it processes each resource, the script generates a unique hash based on the file's content and appends this hash to the corresponding links. Simultaneously, the script copies all the files to an output folder, ensuring that resources are organized and properly linked.
This script is designed to work with any web project, as long as it used as a post-build step in your workflow.
Why?
Force the update of your website for users who most likely have a cached version. By changing the file path, the browser is forced to fetch the latest version, ensuring users get the update immediately without needing to manually clear their cache or wait for it to expire.
If a file doesn't change, its hash remains the same, and the browser will serve the cached version regardless.
How to use?
Program
hash-web ./public/index.html ./build
API
hash_web({
input: `./public/index.html`,
output_dir: `./build`
});
Handle links
| Ext | Patterns |
|-----|----------|
| .html
| src=""
, href=""
, <script></script>
, srcset=""
, <object data="">
, content=""
|
| .css
| url("")
|
| .js
| import
, fetch
, new URL
, new Request
|
| .webmanifest
| "src": ""
|