Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature Request] Add Extract ToC #8

Open
yordis opened this issue Oct 31, 2021 · 2 comments
Open

[Feature Request] Add Extract ToC #8

yordis opened this issue Oct 31, 2021 · 2 comments

Comments

@yordis
Copy link

yordis commented Oct 31, 2021

I would like to extract the TOC without injecting it back so I can have a bit more control of what to do with it.

Primarily the rendering of such content will be completely out of the element that renders the mdx that I have set up and is able to read the ToC on the server-side so I can create filtering.

@b-x-wu
Copy link

b-x-wu commented Mar 20, 2023

+1! I'm wondering if there can be an option to return the generated ToC node instead of the root node of the entire document.

@b-x-wu b-x-wu mentioned this issue Apr 3, 2023
@kerwanp
Copy link

kerwanp commented May 13, 2023

Hi! I was also look for a solution to extract the table of content.

I decided to use https://cheerio.js.org/ to extract the table of content and use it where I want, here is an example:

  let content = (
    await unified()
      .use(remarkParse)
      .use(remarkRehype)
      .use(rehypeHighlight)
      .use(rehypeSlug)
      .use(rehypeStringify)
      .use(toc, {
        headings: ["h1", "h2", "h3"],
      })
      .process(body_markdown)
  ).toString();

  const $ = cheerio.load(content.toString());

  const tocContent = $("nav.toc").html();

  $("nav.toc").remove();

  content = $.html();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants