rvvr v1.0.0
rvvr 🎰
Inject a content hash to imported subresource paths of HTML, SVG, JS, or CSS files. Allows long-term, immutable HTTP caching.
$ rvvr --input './src/**.{js,html,css,svg}' --output ./dist
Examples
Format | Encoding | Length | Example |
---|---|---|---|
query | hex | 4 | file.png?v=43f7 |
name | hex | 4 | file.a83e.svg |
query | emoji | 1 | file.css?v=🍄 |
name | emoji | 1 | file.🦄.js |
Supported Syntax
HTML & SVG
All href
and src
attributes.
<link rel='stylesheet' href='./design.css'>
<script src='./code.js'></script>
<img src='./image.jpg'>
CSS
All url()
values.
@import './module.css';
@font-face { src: url('./font.woff'); }
h1 { background: url('./pattern.svg'); }
JavaScript
All import
or named export
statements.
import './module.js'
export * from './package.js'
CLI
--input ./path/to/files
- Alias:
-i
- Required: Yes
- Multiple: Yes
Path to a file, or wildcard (glob pattern) to multiple files.
--output ./path/to/directory
- Alias:
-o
- Required: Yes
Path to a directory to write all files. Directory structure is preserved.
--force
, --no-force
- Alias:
-f
- Default:
false
Overwrite existing files.
--position
- Alias:
-p
- Values:
query
,name
- Default:
query
Either modify the file name of each subresource, or append a query string containing the content hash.
Both methods are widely used for many years and compatible with all browsers, servers, and proxies.
The query
approach does not rename files, which may be convenient by retaining consistent file names across versions.
The name
approach allows for simultaneous hosting of multiple versions. Each version of the same source file will have its own unique filename.
--encoding
- Alias:
-e
- Values:
hex
,emoji
- Default:
hex
Character encoding to use for the hash. Hexadecimal (0-9, a-f) or base-emoji-512.
--length
- Alias:
-l
- Default:
4
(hex) or1
(emoji)
Number of characters to use in the hash.
API
const rvvr = require('rvvr')
for await (const resource of rvvr(input, options)) {
// resource:
// { from, to, hash, data }
}
rvvr(input, options)
Returns an async generator that emits processed resources.
input
Type: String or Array
One or more file paths to process. Globs are supported.
See Also
- Unbundle - Trace JS imports and place all subresources in their own directory. Use this before rvvr.
- @commonshost/manifest - Trace all website subresources to build HTTP/2 Server Push instructions for web servers and CDNs.
5 years ago