Rehype Rewrite4.0.2Rehype Rewrite4.0.2
Rewrite element withrehype.
This package isESM only: Node 12+ is needed to use it and it must beimport instead ofrequire.
npminstall rehype-rewrite🚧 Migrate from rehype-rewrite
v2.xtov3.x.rehype()- .use(rehypeRewrite, (node, index, parent) => {})+ .use(rehypeRewrite, {+ rewrite: (node, index, parent) => {}+ })
import{ rehype}from'rehype';importrehypeRewritefrom'rehype-rewrite';importstringifyfrom'rehype-stringify';const html=`<h1>header</h1>`;const htmlStr=rehype().data('settings',{fragment:true}).use(rehypeRewrite,{rewrite:(node, index, parent)=>{if(node.type=='text'&& node.value=='header'){ node.value=''}}}).use(stringify).processSync(html).toString()<h1>header</h1>
Output:<h1></h1>
import{ Plugin}from'unified';import{ Root, Element, ElementContent, RootContent}from'hast';/** Get the node tree source code string */exportdeclareconstgetCodeString:(data?: ElementContent[], code?:string)=>string;exportdeclaretypeRehypeRewriteOptions={/** * 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)). * If `selector` is not set then wrap will check for a body all elements. */ selector?:string;/** Rewrite Element. */rewrite(node: Root| RootContent, index:number|null, parent: Root| Element|null):void;};declareconst remarkRewrite: Plugin<[RehypeRewriteOptions?], Root>;exportdefault remarkRewrite;selector?: string;Select an element to be wrapped. Expects a string selector that can be passed to hast-util-select (supported selectors). Ifselector is not set then wrap will check for a body all elements.
rewrite(node, index, parent): void;Rewrite element.
import{ rehype}from'rehype';importrehypeRewritefrom'rehype-rewrite';importstringifyfrom'rehype-stringify';const html=`<h1>header</h1><h1>header</h1><h1>header</h1>`;const htmlStr=rehype().data('settings',{fragment:true}).use(rehypeRewrite,{selector:'h1',rewrite:(node)=>{if(node.type==='element'){ node.properties.className='test';}}}).use(stringify).processSync(html).toString()<h1>header</h1><h1>header</h1><h1class="title3">header</h1>
Output:<h1class="test">header</h1><h1class="test">header</h1><h1class="test">header</h1>
import{ rehype}from'rehype';importrehypeRewritefrom'rehype-rewrite';importstringifyfrom'rehype-stringify';const html=`<h1>header</h1>`;const htmlStr=rehype().use(rehypeRewrite,{rewrite:(node)=>{if(node.type=='element'&& node.tagName=='body'){ node.properties={...node.properties,style:'color:red;'}}}}).use(stringify).processSync(html).toString()<h1>header</h1>
Output:<html><head></head><bodystyle="color:red;"><h1>header</h1></body></html>
import{ rehype}from'rehype';importrehypeRewritefrom'rehype-rewrite';importstringifyfrom'rehype-stringify';const html=`<h1>hello</h1>`;const htmlStr=rehype().data('settings',{fragment:true}).use(rehypeRewrite,{rewrite:(node)=>{if(node.type=='element'&& node.tagName=='h1'){ node.children=[...node.children,{type:'element',tagName:'span',properties:{},children:[{type:'text',value:' world'}]}]}}}).use(stringify).processSync(html).toString()<h1>hello</h1>
Output:<h1>hello<span> world</span></h1>
import{ unified}from'unified';importremarkParsefrom'remark-parse';importrehypeRawfrom'rehype-raw';importremark2rehypefrom'remark-rehype';importrehypeRewritefrom'rehype-rewrite';importstringifyfrom'rehype-stringify';const html=`<h1>hello</h1>`;const htmlStr=unified().use(remarkParse).use(remark2rehype,{allowDangerousHtml:true}).use(rehypeRaw).use(rehypeRewrite,{rewrite:(node)=>{if(node.type=='element'&& node.tagName=='h1'){ node.properties={...node.properties,style:'color:red;'}}}}).use(stringify).processSync(html).toString()<h1>hello</h1>
Output:<h1style="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 withaction-contributors.
MIT ©Kenny Wong