{"id":28250390,"url":"https://github.com/90dy/typescript-template-engine","last_synced_at":"2025-06-14T01:32:23.735Z","repository":{"id":281380032,"uuid":"945085654","full_name":"90dy/typescript-template-engine","owner":"90dy","description":"🧬 TypeScript as a template engine","archived":false,"fork":false,"pushed_at":"2025-06-03T15:18:59.000Z","size":117,"stargazers_count":7,"open_issues_count":11,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-04T01:13:45.609Z","etag":null,"topics":["codegen","tags","template","typescript"],"latest_commit_sha":null,"homepage":"https://marketplace.visualstudio.com/items?itemName=90dy.ts-tmpl-engine-vscode","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/90dy.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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":"2025-03-08T16:17:57.000Z","updated_at":"2025-06-03T15:19:01.000Z","dependencies_parsed_at":"2025-06-03T17:15:48.441Z","dependency_job_id":"2988dd2d-45e0-41fc-99a3-8fb1bff4e18a","html_url":"https://github.com/90dy/typescript-template-engine","commit_stats":null,"previous_names":["90dy/ts-tag","90dy/ts-template","90dy/ts-tmpl-engine","90dy/typescript-template-engine"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/90dy/typescript-template-engine","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/90dy%2Ftypescript-template-engine","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/90dy%2Ftypescript-template-engine/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/90dy%2Ftypescript-template-engine/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/90dy%2Ftypescript-template-engine/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/90dy","download_url":"https://codeload.github.com/90dy/typescript-template-engine/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/90dy%2Ftypescript-template-engine/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259745199,"owners_count":22905064,"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":["codegen","tags","template","typescript"],"created_at":"2025-05-19T14:17:59.625Z","updated_at":"2025-06-14T01:32:23.729Z","avatar_url":"https://github.com/90dy.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# TypeScript Template Engine\n\n[![License](https://img.shields.io/badge/license-BSD--3--Clause-blue.svg)](https://github.com/90dy/typescript-template-engine/blob/main/LICENSE)\n[![GitHub stars](https://img.shields.io/github/stars/90dy/typescript-template-engine)](https://github.com/90dy/typescript-template-engine/stargazers)\n[![GitHub issues](https://img.shields.io/github/issues/90dy/typescript-template-engine)](https://github.com/90dy/typescript-template-engine/issues)\n[![VSCode Extension](https://img.shields.io/visual-studio-marketplace/v/90dy.ts-tmpl-engine-vscode?label=VSCode%20Extension)](https://marketplace.visualstudio.com/items?itemName=90dy.ts-tmpl-engine-vscode)\n\nA monorepo for TypeScript template engine tools and libraries. This project enables using TypeScript template literals with proper syntax highlighting for various file formats in VSCode, along with code generation capabilities.\n\n## Features\n\n- Use TypeScript template literals as a templating engine\n- Syntax highlighting for various file types within template literals\n- Support for multiple file types in a single template\n- Support for 40+ programming languages and file formats\n- Easy to extend with new file type support\n- Test utilities for verifying templates\n\n## Packages\n\nThis monorepo contains the following packages:\n\n### @tmpl/core\n\n[![JSR](https://jsr.io/badges/@tmpl/core)](https://jsr.io/@tmpl/core)\n\nCore template literals functionality with syntax highlighting.\n\n```bash\n# Using npm/npx\nnpx jsr add @tmpl/core\n\n# Using Deno/JSR\nimport { html, css, js } from \"jsr:@tmpl/core\";\n```\n\n### @tmpl/gen\n\n[![JSR](https://jsr.io/badges/@tmpl/gen)](https://jsr.io/@tmpl/gen)\n\nCode generation CLI for template literals. Create template files with language extensions and generate code from them.\n\n```bash\n# Process input from stdin\ndeno run -A jsr:@tmpl/gen \u003c index.html.ts\n\n# Use current directory as both source and destination\ndeno run -A jsr:@tmpl/gen ./src\n\n# Specify source and destination directories\ndeno run -A jsr:@tmpl/gen ./dist ./src/templates\n```\n\n## Usage Examples\n\n### Template Literals (@tmpl/core)\n\n```typescript\nimport { html, css, js, sql } from \"@tmpl/core\";\n\n// HTML with syntax highlighting\nconst template = html`\n  \u003cdiv class=\"container\"\u003e\n    \u003ch1\u003e${title}\u003c/h1\u003e\n    \u003cp\u003e${content}\u003c/p\u003e\n  \u003c/div\u003e\n`;\n\n// CSS with syntax highlighting\nconst styles = css`\n  .container {\n    max-width: 800px;\n    margin: 0 auto;\n  }\n`;\n\n// JavaScript with syntax highlighting\nconst script = js`\n  function handleClick() {\n    console.log('Button clicked!');\n  }\n`;\n\n// SQL with syntax highlighting\nconst query = sql`\n  SELECT * FROM users WHERE id = ${userId}\n`;\n```\n\n## VSCode Extension\n\n[![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/90dy.ts-tmpl-engine-vscode)](https://marketplace.visualstudio.com/items?itemName=90dy.ts-tmpl-engine-vscode)\n[![Visual Studio Marketplace Installs](https://img.shields.io/visual-studio-marketplace/i/90dy.ts-tmpl-engine-vscode)](https://marketplace.visualstudio.com/items?itemName=90dy.ts-tmpl-engine-vscode)\n[![Visual Studio Marketplace Rating](https://img.shields.io/visual-studio-marketplace/r/90dy.ts-tmpl-engine-vscode)](https://marketplace.visualstudio.com/items?itemName=90dy.ts-tmpl-engine-vscode)\n\nThis project includes a VSCode extension that provides syntax highlighting for template literals within TypeScript (.ts) files. To use it:\n\n1. Install the extension from the VSCode marketplace\n2. Use the appropriate tag functions in your TypeScript code (html, css, js, etc.)\n3. The content inside the template literals will be highlighted with the appropriate syntax highlighting for that language\n4. This works directly in your .ts files - no special file extensions needed!\n\n## Architecture\n\nThe project consists of:\n\n1. Core template tag functions for various file types\n2. A registry system for managing file type handlers\n3. VSCode extension configuration for syntax highlighting\n\n## Supported Languages\n\nTypeScript Template Engine supports 40+ programming languages and file formats, including:\n\n### Web Languages\n- HTML (`html`)\n- CSS (`css`)\n- JavaScript (`js`)\n- TypeScript (`ts`)\n- JSX (`jsx`)\n- TSX (`tsx`)\n\n### Data Formats\n- JSON (`json`)\n- XML (`xml`)\n- YAML (`yaml`)\n- TOML (`toml`)\n- INI (`ini`)\n- CSV (`csv`)\n\n### Markup Languages\n- Markdown (`md`)\n- LaTeX (`tex`)\n- reStructuredText (`rst`)\n\n### Query Languages\n- SQL (`sql`)\n- GraphQL (`graphql`)\n\n### Programming Languages\n- Python (`py`)\n- Ruby (`rb`)\n- Go (`go`)\n- Rust (`rs`)\n- C (`c`)\n- C++ (`cpp`)\n- C# (`cs`)\n- Java (`java`)\n- PHP (`php`)\n- Swift (`swift`)\n- Kotlin (`kt`)\n- And many more!\n\n### Using Custom Extensions\n\nYou can use any file extension with the `ext` function:\n\n```typescript\nimport { ext } from \"@tmpl/core\";\n\n// Use a custom extension\nconst svelte = ext(\"svelte\");\nconst template = svelte`\n  \u003cscript\u003e\n    let count = 0;\n    \n    function increment() {\n      count += 1;\n    }\n  \u003c/script\u003e\n\n  \u003cbutton on:click={increment}\u003e\n    Clicked {count} {count === 1 ? 'time' : 'times'}\n  \u003c/button\u003e\n`;\n```\n\n### Code Generation (@tmpl/gen)\n\nCreate template files with language extensions:\n\n```typescript\n// index.html.ts\nimport { html } from \"@tmpl/core\";\n\nconst title = \"My Website\";\nconst navItems = [\"Home\", \"About\", \"Contact\"];\n\nexport default html`\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n\u003chead\u003e\n  \u003ctitle\u003e${title}\u003c/title\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n  \u003cheader\u003e\n    \u003ch1\u003e${title}\u003c/h1\u003e\n    \u003cnav\u003e\n      \u003cul\u003e\n        ${navItems.map(item =\u003e html`\n          \u003cli\u003e\u003ca href=\"#${item.toLowerCase()}\"\u003e${item}\u003c/a\u003e\u003c/li\u003e`.indent(-2)\n        ).join('\\n        ')}\n      \u003c/ul\u003e\n    \u003c/nav\u003e\n  \u003c/header\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n`;\n```\n\nThen generate the files using one of these methods:\n\n```bash\n# Process input from stdin\ndeno run -A jsr:@tmpl/gen \u003c index.html.ts\n\n# Use current directory as both source and destination\ndeno run -A jsr:@tmpl/gen ./src\n\n# Specify source and destination directories\ndeno run -A jsr:@tmpl/gen ./dist ./src/templates\n```\n\nThe CLI includes signal handling to ensure temporary files are properly cleaned up when processing stdin input, even if the process is interrupted.\n\n## Development\n\nThe project uses a Makefile to simplify development, testing, building, and publishing tasks.\n\n```bash\n# Show available make targets\nmake help\n\n# Run tests\nmake test\n\n# Generate syntax highlighting configurations for VSCode extension\nmake generate-syntaxes\n\n# Sync version from deno.json to all workspace files\nmake sync-version\n\n# Build the VSCode extension\nmake build-extension\n\n# Run the demo\nmake demo\n```\n\n## Publishing\n\nThis project uses GitHub Actions and semantic-release for automated publishing with semantic versioning.\n\n### Commit Message Format\n\nThis project follows the [Conventional Commits](https://www.conventionalcommits.org/) specification for commit messages:\n\n- `feat: ...` - A new feature (minor version bump)\n- `fix: ...` - A bug fix (patch version bump)\n- `docs: ...` - Documentation changes\n- `style: ...` - Code style changes (formatting, etc.)\n- `refactor: ...` - Code changes that neither fix bugs nor add features\n- `perf: ...` - Performance improvements\n- `test: ...` - Adding or updating tests\n- `chore: ...` - Changes to the build process or auxiliary tools\n\nBreaking changes are indicated by adding `BREAKING CHANGE:` in the commit message body or using `!` after the type:\n\n```\nfeat!: change API to use new authentication system\n```\n\n### Manual Publishing\n\nYou can also publish packages manually:\n\n```bash\n# Publish to JSR\nmake publish-jsr\n\n# Publish VSCode extension\nmake publish-extension\n\n# Publish all packages to all platforms\nmake publish\n```\n\n### Version Synchronization\n\nThe project uses a version synchronization system to ensure that all packages in the monorepo have the same version. The version is defined in the root `deno.json` file and is automatically synchronized to all workspace packages when building or publishing.\n\nTo manually synchronize versions:\n\n```bash\nmake sync-version\n```\n\nThis will update the version in:\n- src/core/deno.json\n- src/gen/deno.json\n- vscode-extension/package.json\n\n## License\n\nBSD 3-Clause License\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2F90dy%2Ftypescript-template-engine","html_url":"https://awesome.ecosyste.ms/projects/github.com%2F90dy%2Ftypescript-template-engine","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2F90dy%2Ftypescript-template-engine/lists"}