{"id":24983693,"url":"https://github.com/posthtml/posthtml-hash","last_synced_at":"2025-06-14T20:06:18.875Z","repository":{"id":36047375,"uuid":"204356828","full_name":"posthtml/posthtml-hash","owner":"posthtml","description":"PostHTML plugin for hashing file names","archived":false,"fork":false,"pushed_at":"2024-12-14T18:47:39.000Z","size":447,"stargazers_count":7,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-05-08T00:41:33.753Z","etag":null,"topics":["asset","cache","hash","posthtml","posthtml-plugin"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/posthtml.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2019-08-25T22:29:05.000Z","updated_at":"2024-12-14T18:47:43.000Z","dependencies_parsed_at":"2024-04-14T21:44:21.027Z","dependency_job_id":"5e243d4f-0033-4426-b01e-e40e2e4a53a0","html_url":"https://github.com/posthtml/posthtml-hash","commit_stats":{"total_commits":98,"total_committers":3,"mean_commits":"32.666666666666664","dds":"0.44897959183673475","last_synced_commit":"4317a921effbedea28ab647d9346ace679a4097b"},"previous_names":["metonym/posthtml-hash"],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posthtml%2Fposthtml-hash","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posthtml%2Fposthtml-hash/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posthtml%2Fposthtml-hash/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posthtml%2Fposthtml-hash/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/posthtml","download_url":"https://codeload.github.com/posthtml/posthtml-hash/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253283235,"owners_count":21883595,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["asset","cache","hash","posthtml","posthtml-plugin"],"created_at":"2025-02-04T09:20:18.808Z","updated_at":"2025-06-14T20:06:18.832Z","avatar_url":"https://github.com/posthtml.png","language":"TypeScript","readme":"# posthtml-hash \u003cimg align=\"right\" width=\"220\" height=\"200\" title=\"PostHTML logo\" src=\"http://posthtml.github.io/posthtml/logo.svg\"\u003e\n\n[![NPM][npm]][npm-url]\n\n`posthtml-hash` is a [PostHTML](https://github.com/posthtml/posthtml) plugin for hashing file names to enable caching.\n\n```diff\n\u003chtml\u003e\n  \u003chead\u003e\n-   \u003clink rel=\"stylesheet\" href=\"styles.[hash].css\" /\u003e\n+   \u003clink rel=\"stylesheet\" href=\"styles.9a6cf95c41e87b9dc102.css\" /\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n-   \u003cscript src=\"src.[hash].js\"\u003e\u003c/script\u003e\n+   \u003cscript src=\"src.b0dcc67ffc1fd562f212.js\"\u003e\u003c/script\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n## Install\n\n```bash\n# Yarn\nyarn add -D posthtml-hash\n\n# npm\nnpm i -D posthtml-hash\n\n# pnpm\npnpm i -D posthtml-hash\n```\n\n## Usage\n\n### Input\n\nBy default, the plugin will attempt to hash file names that contain `[hash]`. As an additional qualifier, only nodes containing `href`, `src`, or `content` attributes are eligible.\n\n```html\n\u003chtml\u003e\n  \u003chead\u003e\n    \u003c!-- ✅ hashed --\u003e\n    \u003clink rel=\"stylesheet\" href=\"style.[hash].css\" /\u003e\n\n    \u003c!-- ❌ not hashed --\u003e\n    \u003clink rel=\"stylesheet\" href=\"reset.css\" /\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    \u003c!-- ✅ hashed --\u003e\n    \u003cscript src=\"src.[hash].js\"\u003e\u003c/script\u003e\n\n    \u003c!-- ❌ not hashed --\u003e\n    \u003cscript src=\"analytics.js\"\u003e\u003c/script\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n### Node.js\n\nThe recommended usage of this plugin is to incorporate it in your post-build process.\n\nLet's say that you use Rollup to bundle and minify your CSS and JavaScript. The template `index.html` is copied to the `build` folder.\n\n```js\n// postbuild.js\nconst fs = require(\"fs\");\nconst posthtml = require(\"posthtml\");\nconst { hash } = require(\"posthtml-hash\");\n\nconst html = fs.readFileSync(\"./build/index.html\");\n\nposthtml()\n  .use(hash({ path: \"build\" }))\n  .process(html)\n  .then((result) =\u003e fs.writeFileSync(\"./build/index.html\", result.html));\n```\n\nFor convenience, you can add the post-build script to your package.json. The `postbuild` script is automatically invoked following the `build` script.\n\n```json\n{\n  \"scripts\": {\n    \"build\": \"rollup -c\",\n    \"postbuild\": \"node postbuild.js\"\n  }\n}\n```\n\n### Custom Hash Length\n\nCustomize the hash length by specifying an integer after the `hash:{NUMBER}`. The default hash length is `20`.\n\n**Note**: This only works for a pattern that uses square brackets and a colon separator. Use the `hashLength` option for different patterns.\n\n```html\n\u003cscript src=\"src.[hash].js\"\u003e\u003c/script\u003e\n\u003c!-- src.b0dcc67ffc1fd562f212.js --\u003e\n\n\u003cscript src=\"src.[hash:8].js\"\u003e\u003c/script\u003e\n\u003c!-- src.b0dcc67f.js --\u003e\n```\n\n### Options\n\nThis plugin assumes that the file to process is in the same directory as the PostHTML script. If not, specify the relative path to the html file in `options.path`:\n\n```js\nhash({\n  /**\n   * Relative path to the HTML file being processed\n   * @default \"\"\n   */\n  path: \"public\",\n\n  /**\n   * File name pattern (regular expression) to match\n   * @default new RegExp(/\\[hash.*]/g)\n   */\n  pattern: new RegExp(/custom-file-pattern/),\n\n  /**\n   * Hash length\n   * @default 20\n   */\n  hashLength: 8,\n\n  /**\n   * Transform the href/src/content attribute value to a relative file path\n   * @default (filepath) =\u003e filepath\n   */\n  transformPath: (filepath) =\u003e filepath.replace(\"https://example.com/\", \"\"),\n});\n```\n\n## Recipes\n\n### Custom Pattern and Hash Length\n\n```js\nhash({\n  pattern: new RegExp(/custom-file-pattern/),\n  hashLength: 8,\n});\n```\n\nResult:\n\n```diff\n- \u003cscript src=\"script.custom-file-pattern.js\"\u003e\u003c/script\u003e\n+ \u003cscript src=\"script.b0dcc67f.js\"\u003e\u003c/script\u003e\n```\n\n### Remote origin URLs\n\nInput HTML:\n\n```html\n\u003chead\u003e\n  \u003cmeta charset=\"utf-8\" /\u003e\n  \u003c!-- We want to hash this image file name and preserve the remote origin URL --\u003e\n  \u003cmeta property=\"og:image\" content=\"https://example.com/image.[hash].png\" /\u003e\n\u003c/head\u003e\n```\n\n```js\nhash({\n  transformPath: (filepath) =\u003e {\n    // removes the targeted remote origin URL when looking up the files locally\n    return filepath.replace(\"https://example.com/\", \"\");\n  },\n});\n```\n\n## Examples\n\nSee the [examples folder](examples) for end-to-end use cases.\n\n## Contributing\n\nSee the [PostHTML Guidelines](https://github.com/posthtml/posthtml/tree/master/docs).\n\n## [Changelog](CHANGELOG.md)\n\n## License\n\n[MIT](LICENSE)\n\n[npm]: https://img.shields.io/npm/v/posthtml-hash.svg?color=%23fb7954\n[npm-url]: https://npmjs.com/package/posthtml-hash\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fposthtml%2Fposthtml-hash","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fposthtml%2Fposthtml-hash","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fposthtml%2Fposthtml-hash/lists"}