# rehype-raw [![Build][build-badge]][build] [![Coverage][coverage-badge]][coverage] [![Downloads][downloads-badge]][downloads] [![Size][size-badge]][size] [![Sponsors][sponsors-badge]][collective] [![Backers][backers-badge]][collective] [![Chat][chat-badge]][chat] [**rehype**][rehype] plugin to reparse the tree (and raw nodes). Keeping positional info OK. 🙌 Tiny wrapper around [`hast-util-raw`][raw] ## Install [npm][]: ```sh npm install rehype-raw ``` ## Use Say we have the following Markdown file, `example.md`: ```markdown
A mix of *Markdown* and HTML.
``` And our script, `example.js`, looks as follows: ```js var vfile = require('to-vfile') var report = require('vfile-reporter') var unified = require('unified') var markdown = require('remark-parse') var remark2rehype = require('remark-rehype') var doc = require('rehype-document') var format = require('rehype-raw') var stringify = require('rehype-stringify') var raw = require('rehype-raw') unified() .use(markdown) .use(remark2rehype, {allowDangerousHTML: true}) .use(raw) .use(doc, {title: '🙌'}) .use(format) .use(stringify) .process(vfile.readSync('example.md'), function(err, file) { console.error(report(err || file)) console.log(String(file)) }) ``` Now, running `node example` yields: ```html example.md: no issues found 🙌

A mix of Markdown and HTML.

``` ## API ### `rehype().use(raw)` Parse the tree again, also parsing “raw” nodes (as exposed by [`remark-rehype`][remark-rehype]). ###### Note This project parses a [**hast**][hast] tree with embedded raw HTML. This typically occurs because we’re coming from Markdown, often parsed by [`remark-parse`][remark-parse]. Inside Markdown, HTML is a black box: Markdown doesn’t know what’s inside that HTML. So, when `rehype-raw` maps Markdown to HTML, it cannot understand raw embedded HTML. That’s where this project comes in. But, Markdown is much terser than HTML, so it’s often preferred to use Markdown, in HTML, inside Markdown. As can be seen in the above example. However, Markdown can only be mixed with HTML in some cases. Take the following examples: * **Warning**: does not work: ```markdown
A mix of *Markdown* and HTML.
``` …this is seen as one big block of HTML: ```html
A mix of *Markdown* and HTML.
``` * This does work: ```markdown
A mix of *Markdown* and HTML.
``` …it’s one block with the opening HTML tag, then a paragraph of Markdown, and another block with closing HTML tag. That’s because of the blank lines: ```html
A mix of Markdown and HTML.
``` * This also works: ```markdown A mix of *Markdown* and HTML. ``` …Inline tags are parsed as separate tags, with Markdown in between: ```html

A mix of Markdown and HTML.

``` This occurs if the tag name is not included in the list of [block][] tag names. ## Contribute See [`contributing.md`][contributing] in [`rehypejs/.github`][health] for ways to get started. See [`support.md`][support] for ways to get help. This project has a [Code of Conduct][coc]. By interacting with this repository, organisation, or community you agree to abide by its terms. ## License [MIT][license] © [Titus Wormer][author] [build-badge]: https://img.shields.io/travis/rehypejs/rehype-raw.svg [build]: https://travis-ci.org/rehypejs/rehype-raw [coverage-badge]: https://img.shields.io/codecov/c/github/rehypejs/rehype-raw.svg [coverage]: https://codecov.io/github/rehypejs/rehype-raw [downloads-badge]: https://img.shields.io/npm/dm/rehype-raw.svg [downloads]: https://www.npmjs.com/package/rehype-raw [size-badge]: https://img.shields.io/bundlephobia/minzip/rehype-raw.svg [size]: https://bundlephobia.com/result?p=rehype-raw [sponsors-badge]: https://opencollective.com/unified/sponsors/badge.svg [backers-badge]: https://opencollective.com/unified/backers/badge.svg [collective]: https://opencollective.com/unified [chat-badge]: https://img.shields.io/badge/join%20the%20community-on%20spectrum-7b16ff.svg [chat]: https://spectrum.chat/unified/rehype [npm]: https://docs.npmjs.com/cli/install [health]: https://github.com/rehypejs/.github [contributing]: https://github.com/rehypejs/.github/blob/master/contributing.md [support]: https://github.com/rehypejs/.github/blob/master/support.md [coc]: https://github.com/rehypejs/.github/blob/master/code-of-conduct.md [license]: license [author]: https://wooorm.com [rehype]: https://github.com/rehypejs/rehype [hast]: https://github.com/syntax-tree/hast [raw]: https://github.com/syntax-tree/hast-util-raw [remark-parse]: https://github.com/remarkjs/remark/blob/master/packages/remark-parse [remark-rehype]: https://github.com/remarkjs/remark-rehype [block]: https://github.com/remarkjs/remark/blob/master/packages/remark-parse/lib/block-elements.js