{"id":16641801,"url":"https://github.com/samthor/html-template-compiler","last_synced_at":"2025-06-16T19:35:25.402Z","repository":{"id":257702046,"uuid":"859071887","full_name":"samthor/html-template-compiler","owner":"samthor","description":"HTML Template Compiler","archived":false,"fork":false,"pushed_at":"2024-10-03T02:18:37.000Z","size":57,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-18T15:52:50.231Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/samthor.png","metadata":{"files":{"readme":"README.md","changelog":null,"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}},"created_at":"2024-09-18T03:12:33.000Z","updated_at":"2024-10-03T02:18:40.000Z","dependencies_parsed_at":"2024-09-18T06:46:56.584Z","dependency_job_id":"1c14e620-3a1f-460d-a3cf-7a3a3b7de04d","html_url":"https://github.com/samthor/html-template-compiler","commit_stats":null,"previous_names":["samthor/html-template-compiler"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samthor%2Fhtml-template-compiler","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samthor%2Fhtml-template-compiler/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samthor%2Fhtml-template-compiler/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/samthor%2Fhtml-template-compiler/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/samthor","download_url":"https://codeload.github.com/samthor/html-template-compiler/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243164830,"owners_count":20246718,"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":[],"created_at":"2024-10-12T07:47:55.240Z","updated_at":"2025-03-12T05:28:40.555Z","avatar_url":"https://github.com/samthor.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"A simple HTML template compiler that generates compiled templates which are environment-agnostic.\n(The compiler itself runs in Node.)\n\n## Usage\n\n```bash\n$ npx html-template-compiler templates/\n```\n\nThis emits TypeScript code, for the files \"templates/\\*.html\", to stdout.\n(You can use glob-syntax in your shell, too.)\nThe generated code can be called to render templates, and includes relatively comprehensive types.\n\nBy default this imports this package's runtime code to render templates.\nYou can pass flag `-i` to inline the code instead.\nEither way, use a tree-shaking compiler.\n\nThe 'rendered' object is something with a `toString()` helper.\n\n```ts\nimport { renderIndex } from './generated-template.ts';\nconst out = renderIndex({ prop: 'hello', there: 'jim' });\nconst s = out.toString();\n```\n\n## Syntax\n\nThis supports simple rendering of passed properties:\n\n```html\n\u003cdiv id=\"{{idName}}\" ?disabled=\"{{foo}}\"\u003e{{content}}\u003c/div\u003e\n{{object.property.hello}}\n```\n\nYou can use custom tags to handle conditionals:\n\n```html\n\u003chc:if i=\"foo\"\u003e\n  \u003cdiv class=\"foo-is-truthy\"\u003e{{foo}}\u003c/div\u003e\n  \u003chc-else /\u003e\n  \u003cdiv class=\"else\"\u003eOr else?\u003c/div\u003e\n\u003c/hc-if\u003e\n```\n\nYou can pass e.g., `!foo` to invert the conditional.\n\nOr loops:\n\n```html\n\u003chc:loop iter=\"foo\" v=\"eachFoo\"\u003e\n  \u003cdiv class=\"each-foo-bar\"\u003e{{eachFoo.bar}}\u003c/div\u003e\n\u003c/hc:loop\u003e\n\u003chc:if iter=\"!foo\"\u003e\n  \u003c!-- Iterates the first item, don't use on generators --\u003e\n  \u003cdiv class=\"empty\"\u003eNo items available\u003c/div\u003e\n\u003c/hc:if\u003e\n```\n\nYou can also use `\u003chc:else /\u003e` within a loop to denote an empty block.\n\n## Unsafe\n\nTo include unsafe HTML inside other templates, first mark something as unsafe:\n\n```ts\nimport { unsafe } from 'html-template-compiler';\nconst out = renderIndex({ body: unsafe('\u003cdiv\u003ehello\u003c/div\u003e') });\n```\n\nThe rendered objects generated by the compiled code are already denoted unsafe.\n\n## TODOs\n\n- This does not currently support `Promise` arguments, but it could be modified to do so\n- It doesn't care or know anything about events or live DOM: this is purely for backend or static generation\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamthor%2Fhtml-template-compiler","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsamthor%2Fhtml-template-compiler","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamthor%2Fhtml-template-compiler/lists"}