hast-util-to-parse5

What is hast-util-to-parse5?

The `hast-util-to-parse5` package is a utility that converts HAST (Hypertext Abstract Syntax Tree) to Parse5's AST (Abstract Syntax Tree). This is useful for working with HTML in a structured way, allowing for transformations, analysis, and other manipulations.

What are hast-util-to-parse5's main functionalities?

Convert HAST to Parse5 AST

This feature allows you to convert a HAST node to a Parse5 AST node. The code sample demonstrates converting a simple HAST node representing a <div> element into its Parse5 AST equivalent.

const toParse5 = require('hast-util-to-parse5');
const hast = { type: 'element', tagName: 'div', properties: {}, children: [] };
const parse5Ast = toParse5(hast);
console.log(parse5Ast);

Other packages similar to hast-util-to-parse5

rehype-parse

The `rehype-parse` package is used to parse HTML into HAST. While `hast-util-to-parse5` converts HAST to Parse5 AST, `rehype-parse` works in the opposite direction by converting HTML to HAST. This makes it useful for initial parsing of HTML content before any transformations.

rehype-stringify

The `rehype-stringify` package is used to serialize HAST back into HTML. It complements `hast-util-to-parse5` by providing the reverse functionality: while `hast-util-to-parse5` converts HAST to Parse5 AST, `rehype-stringify` converts HAST to HTML strings.

parse5

The `parse5` package is a comprehensive library for parsing and serializing HTML. It provides a full suite of tools for working with HTML, including parsing HTML into its own AST format and serializing it back. `hast-util-to-parse5` specifically bridges the gap between HAST and Parse5 AST, making it a more specialized tool compared to the broader functionality of `parse5`.

README

hast-util-to-parse5

Transform HAST to Parse5’s AST.

Why not use an adapter? Because it’s more code weight to use adapters, and much more fragile.

Installation

npm:

npm install hast-util-to-parse5

Usage

var toParse5 = require('hast-util-to-parse5')

var ast = toParse5({
  type: 'element',
  tagName: 'h1',
  properties: {},
  children: [{type: 'text', value: 'World!'}]
})

console.log(ast)

Yields:

{ nodeName: 'h1',
  tagName: 'h1',
  attrs: [],
  namespaceURI: 'http://www.w3.org/1999/xhtml',
  childNodes: [ { nodeName: '#text', value: 'World!', parentNode: [Circular] } ] }

API

toParse5(tree[, space])

Transform a HAST Node to an ASTNode according to the default Parse5 adapter.

space

Whether the root of the given tree is in the 'html' or 'svg' space (enum, 'svg' or 'html', default: 'html').

If an svg element is found in the HTML space, toParse5 automatically switches to the SVG space when entering the element, and switches back when leaving.

Contribute

See contributing.md in syntax-tree/hast for ways to get started.

This organisation has a Code of Conduct. By interacting with this repository, organisation, or community you agree to abide by its terms.

License

MIT © Titus Wormer