Gathering detailed insights and metrics for rehype-rewrite
Gathering detailed insights and metrics for rehype-rewrite
Gathering detailed insights and metrics for rehype-rewrite
Gathering detailed insights and metrics for rehype-rewrite
rehype-external-links
rehype plugin to automatically add `target` and `rel` attributes to external links
remark-rehype
remark plugin that turns markdown into HTML to support rehype
rehype-slug
rehype plugin to add `id` attributes to headings
rehype-raw
rehype plugin to reparse the tree (and raw nodes)
npm install rehype-rewrite
Module System
Min. Node Version
Typescript Support
Node Version
NPM Version
21 Stars
106 Commits
1 Forks
3 Watching
2 Branches
2 Contributors
Updated on 27 Aug 2024
TypeScript (100%)
Cumulative downloads
Total Downloads
Last day
-3%
23,550
Compared to previous day
Last week
2%
122,164
Compared to previous week
Last month
19.8%
503,784
Compared to previous month
Last year
99.8%
5,074,666
Compared to previous year
3
6
Rewrite element with rehype.
This package is ESM only: Node 12+ is needed to use it and it must be import
instead of require
.
1npm install rehype-rewrite
🚧 Migrate from rehype-rewrite
v2.xtov3.x
.1rehype() 2- .use(rehypeRewrite, (node, index, parent) => {}) 3+ .use(rehypeRewrite, { 4+ rewrite: (node, index, parent) => {} 5+ })
1import { rehype } from 'rehype'; 2import rehypeRewrite from 'rehype-rewrite'; 3import stringify from 'rehype-stringify'; 4 5const html = `<h1>header</h1>`; 6const htmlStr = rehype() 7 .data('settings', { fragment: true }) 8 .use(rehypeRewrite, { 9 rewrite: (node, index, parent) => { 10 if(node.type == 'text' && node.value == 'header') { 11 node.value = '' 12 } 13 } 14 }) 15 .use(stringify) 16 .processSync(html) 17 .toString()
1<h1>header</h1>
Output:
1<h1></h1>
1import { Plugin } from 'unified'; 2import { Root, Element, ElementContent, RootContent } from 'hast'; 3/** Get the node tree source code string */ 4export declare const getCodeString: (data?: ElementContent[], code?: string) => string; 5export declare type RehypeRewriteOptions = { 6 /** 7 * Select an element to be wrapped. Expects a string selector that can be passed to hast-util-select ([supported selectors](https://github.com/syntax-tree/hast-util-select/blob/master/readme.md#support)). 8 * If `selector` is not set then wrap will check for a body all elements. 9 */ 10 selector?: string; 11 /** Rewrite Element. */ 12 rewrite(node: Root | RootContent, index: number | null, parent: Root | Element | null): void; 13}; 14declare const remarkRewrite: Plugin<[RehypeRewriteOptions?], Root>; 15export default remarkRewrite;
selector?: string;
Select an element to be wrapped. Expects a string selector that can be passed to hast-util-select (supported selectors). If selector
is not set then wrap will check for a body all elements.
rewrite(node, index, parent): void;
Rewrite element.
1import { rehype } from 'rehype'; 2import rehypeRewrite from 'rehype-rewrite'; 3import stringify from 'rehype-stringify'; 4 5const html = `<h1>header</h1><h1>header</h1><h1 class="title3">header</h1>`; 6const htmlStr = rehype() 7 .data('settings', { fragment: true }) 8 .use(rehypeRewrite, { 9 selector: 'h1', 10 rewrite: (node) => { 11 if (node.type === 'element') { 12 node.properties.className = 'test'; 13 } 14 } 15 }) 16 .use(stringify) 17 .processSync(html) 18 .toString()
1<h1>header</h1> 2<h1>header</h1> 3<h1 class="title3">header</h1>
Output:
1<h1 class="test">header</h1> 2<h1 class="test">header</h1> 3<h1 class="test">header</h1>
1import { rehype } from 'rehype'; 2import rehypeRewrite from 'rehype-rewrite'; 3import stringify from 'rehype-stringify'; 4 5const html = `<h1>header</h1>`; 6const htmlStr = rehype() 7 .use(rehypeRewrite, { 8 rewrite: (node) => { 9 if (node.type == 'element' && node.tagName == 'body') { 10 node.properties = { ...node.properties, style: 'color:red;'} 11 } 12 } 13 }) 14 .use(stringify) 15 .processSync(html) 16 .toString()
1<h1>header</h1>
Output:
1<html><head></head><body style="color:red;"><h1>header</h1></body></html>
1import { rehype } from 'rehype'; 2import rehypeRewrite from 'rehype-rewrite'; 3import stringify from 'rehype-stringify'; 4 5const html = `<h1>hello</h1>`; 6const htmlStr = rehype() 7 .data('settings', { fragment: true }) 8 .use(rehypeRewrite, { 9 rewrite: (node) => { 10 if (node.type == 'element' && node.tagName == 'h1') { 11 node.children = [ ...node.children, { 12 type: 'element', 13 tagName: 'span', 14 properties: {}, 15 children: [ 16 {type: 'text', value: ' world'} 17 ] 18 }] 19 } 20 } 21 }) 22 .use(stringify) 23 .processSync(html) 24 .toString()
1<h1>hello</h1>
Output:
1<h1>hello<span> world</span></h1>
1import { unified } from 'unified'; 2import remarkParse from 'remark-parse'; 3import rehypeRaw from 'rehype-raw'; 4import remark2rehype from 'remark-rehype'; 5import rehypeRewrite from 'rehype-rewrite'; 6import stringify from 'rehype-stringify'; 7 8const html = `<h1>hello</h1>`; 9const htmlStr = unified() 10 .use(remarkParse) 11 .use(remark2rehype, { allowDangerousHtml: true }) 12 .use(rehypeRaw) 13 .use(rehypeRewrite, { 14 rewrite: (node) => { 15 if (node.type == 'element' && node.tagName == 'h1') { 16 node.properties = { ...node.properties, style: 'color:red;' } 17 } 18 } 19 }) 20 .use(stringify) 21 .processSync(html) 22 .toString()
1<h1>hello</h1>
Output:
1<h1 style="color:red;">Hello World!</h1>
rehype-video
Add improved video syntax: links to .mp4
and .mov
turn into videos.rehype-attr
New syntax to add attributes to Markdown.rehype-ignore
Ignore content display via HTML comments, Shown in GitHub readme, excluded in HTML.remark-github-blockquote-alert
Remark plugin to add support for GitHub Alert.As always, thanks to our amazing contributors!
Made with action-contributors.
MIT © Kenny Wong
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
0 existing vulnerabilities detected
Reason
license file detected
Details
Reason
packaging workflow detected
Details
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
Found 0/22 approved changesets -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
detected GitHub workflow tokens with excessive permissions
Details
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Score
Last Scanned on 2024-11-18
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More