proper-tags is an evolved version of the widely-used CommonJS package common-tags. It has been updated with the following considerations for modern JavaScript environments:
- 🌟 Extendable: Comes with built-in tools for creating custom tags.
- 📦 ESM Code Base: Ensures native compatibility with modern development tools.
- 🦕 Deno Compatibility: Designed specifically to function seamlessly with the Deno runtime.
- 📝 TypeScript Definitions: Integrated TypeScript typings make development in TypeScript a breeze.
- 🔄 API Consistency: The interface aligns with common-tags, ensuring compatibility with existing frameworks and guides.
Below is a quick guide, check out the full documentation at https://proper-tags.56k.guru.
import { html } from 'proper-tags';
html`
<div id="user-card">
<h2>${user.name}</h2>
</div>
`Install
npm install proper-tagsESM Import:
import { stripIndent } from 'proper-tags';Legacy CommonJS Require:
const { stripIndent } = require('proper-tags');To use proper-tags with Deno, import it from deno.land:
import { html } from 'https://deno.land/x/proper_tags/dist/proper-tags.js';Note: Make sure to freeze the url to a specific version
To include proper-tags via jsdelivr, add the following script tag to your HTML file:
<script src="https://cdn.jsdelivr.net/npm/proper-tags@2.0.2/dist/proper-tags.umd.js"></script>Note: Make sure to replace
2.0.2with the latest version
Like all ES modules, proper-tags begins with an import.
import { stripIndent } from 'proper-tags'html: Properly indents arrays and newline characters in string substitutions.- Aliases:
source,codeBlock
- Aliases:
safeHtml: Similar to html, but with safe HTML escaping for strings.oneLine: Converts multi-line strings into a single line.oneLineTrim: Converts multi-line strings into a single line, trimming newlines.stripIndent: Strips the initial indentation from the beginning of each line in a multiline string.stripIndents: Strips all indentation from the beginning of each line in a multiline string.inlineLists: Inlines an array substitution as a list.oneLineInlineLists: Inlines an array substitution as a list, rendered on a single line.commaLists: Inlines an array substitution as a comma-separated list.commaListsOr: Inlines an array as a comma-separated list, with the last item prefixed by "or".commaListsAnd: Inlines an array as a comma-separated list, with the last item prefixed by "and".oneLineCommaLists: Inlines an array as a comma-separated list on a single line.oneLineCommaListsOr: Inlines an array as a comma-separated list on a single line, with the last item prefixed by "or".oneLineCommaListsAnd: Inlines an array as a comma-separated list on a single line, with the last item prefixed by "and".id: A no-op tag useful in scenarios like mocking.
For more information, examples, functions for advanced usage and best practices, refer to the documentation at proper-tags.56k.guru.
Please see the Contribution Guidelines.
MIT. See license.