Registry / web-framework / html-tag

html-tag

JSON →
library2.0.0jsnpmunverified

The `html-tag` package provides a utility for generating HTML elements programmatically from JavaScript objects. It enables users to create HTML tags by specifying the tag name, an optional attributes object, and optional text content. The library correctly handles void (self-closing) elements and boolean attributes, simplifying basic HTML string construction. As of version 2.0.0, it offers a stable and lightweight solution for basic HTML generation, requiring Node.js 0.10.0 or higher. The package appears to be in maintenance mode, providing a focused API without frequent new feature releases. Its key differentiator is its straightforward, functional approach to HTML string creation, contrasting with more complex templating engines or JSX-based libraries, by focusing solely on direct string output for basic use cases. It does not provide advanced features like comprehensive HTML escaping (beyond basic attribute handling) or DOM manipulation, making it suitable for server-side HTML fragment generation.

web-frameworkserialization
npm install html-tag
github ↗package ↗
INSTALL
IMPORT
SIG · HTML-TAG
H
html-tag
web-frameworkjavascriptv2.0.0
Install
—
Import
—
Disk
—
Pass rate
0/ 6
Env Coverage0 / 6
glibc
18–22
musl
18–22
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18–226 runs
build_error
glibc
node 18–226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

tag
✓ const tag = require('html-tag');
This package exports a single function as its default CommonJS export. This is the primary and most reliable way to use it in Node.js environments.
tag (ESM default)
✓ import tag from 'html-tag';
✗ import { tag } from 'html-tag';
For modern Node.js environments configured for ESM, a default import might work, relying on Node.js's CJS-to-ESM interop. However, the package itself does not provide explicit ESM exports. Attempting to destructure a named import (e.g., `{ tag }`) will result in `undefined` because 'tag' is not a named export.
Type Definition
✓ import type { TagFunction } from 'html-tag';
This package does not ship with TypeScript definitions. If type safety is required, you would typically rely on community-provided `@types/html-tag` (if available) or declare module types manually. The example assumes a hypothetical type exists.

Demonstrates how to generate various HTML elements, including attributes, text content, void elements, and handling of boolean attributes using the `html-tag` function.

const tag = require('html-tag'); // Generate a simple anchor tag with text and attributes console.log(tag('a', {href: 'https://example.com', target: '_blank'}, 'Visit Example')); // Expected: <a href="https://example.com" target="_blank">Visit Example</a> // Generate an image tag (a void element) with attributes console.log(tag('img', {src: 'path/to/image.jpg', alt: 'Descriptive alt text'})); // Expected: <img src="path/to/image.jpg" alt="Descriptive alt text"> // Generate a div with text content console.log(tag('div', 'Hello, World!')); // Expected: <div>Hello, World!</div> // Generate a details tag with a boolean 'open' attribute console.log(tag('details', {open: true})); // Expected: <details open></details> // Force a tag not to render its closing tag (for XML compatibility) console.log(tag('p', 'Some text for XML...', false)); // Expected: <p>Some text for XML...
Debug
Known issues
gotchaThe `html-tag` package does not automatically escape special characters within the `text` argument. Passing unvalidated user input directly as text content can lead to Cross-Site Scripting (XSS) vulnerabilities.
fix
Always sanitize or escape user-provided text content before passing it to `html-tag` to prevent XSS attacks. Consider using a dedicated HTML escaping utility for text nodes.
affects: >=1.0.0
gotchaBoolean attributes are handled strictly based on the boolean `true` or `false` values. Using a string like `'false'` will render the attribute with that string value (e.g., `open="false"`), not remove the attribute.
fix
Ensure you pass a strict boolean `true` or `false` for attributes that should behave as boolean HTML attributes. For example, `tag('details', {open: false})` will omit the 'open' attribute, while `tag('details', {open: 'false'})` will produce `open="false"`.
affects: >=1.0.0
gotchaThe package primarily targets CommonJS environments. While modern Node.js may provide CJS-to-ESM interop, using `import tag from 'html-tag'` might behave unexpectedly or fail in some configurations, especially older ones or specific build tools.
fix
The most reliable way to use `html-tag` is via the CommonJS `require` syntax: `const tag = require('html-tag');`. If using ESM, ensure your build setup or Node.js version (>=12 with default interop) correctly handles CJS imports.
affects: >=1.0.0
gotchaPassing `false` as the last argument to the `tag` function forces the tag to *not* render a closing tag (e.g., `tag('p', 'text', false)` results in `<p>text`). This behavior is intended for XML compatibility and can produce malformed HTML if not used carefully.
fix
Avoid using the `false` argument unless you specifically need to generate XML-like output or are certain your HTML will tolerate unclosed tags. For standard HTML, allow the library to auto-close or recognize void elements.
affects: >=1.0.0
Errors
Common errors & fixes
TypeError: tag is not a function
Attempting to import `tag` using incorrect ESM syntax (e.g., named import `import { tag } from 'html-tag';`) when the package provides a CommonJS default export.
fix
Use a default import for ESM (`import tag from 'html-tag';`) or the CommonJS `require` syntax (`const tag = require('html-tag');`).
ReferenceError: require is not defined
Using the CommonJS `require` function within an ECMAScript Module (ESM) file context in Node.js without proper compatibility setup.
fix
Change your import statement to use `import tag from 'html-tag';` if your environment supports ESM. Alternatively, ensure your file is treated as a CommonJS module (e.g., by using a `.cjs` extension or setting `"type": "commonjs"` in `package.json`).
SyntaxError: Unexpected token '{'
This error can occur if you're trying to destructure a CommonJS default export in an environment that strictly parses `{}` as object destructuring and does not correctly handle CJS-ESM interop for default exports.
fix
Use a direct default import `import tag from 'html-tag';` instead of destructuring `import { tag } from 'html-tag';` for this CommonJS package.
Upgrade
Version history
2.0.0latest on npm
Audit
Dependencies

No dependency data recorded yet.

Agent activity
2 hits · last 30 days
node
2
Resources
githubhttps://github.com/jonschlinkert/html-tag ↗
packagehttps://www.npmjs.com/package/html-tag ↗