eyas / md-heading-id Goto Github PK

I am able to use your plugin with next-mdx-remote like so:

      remarkPlugins: [
        remarkGfm,
        remarkHeadingId,

This works fine and renders to HTML correctly etc.

But when trying to run with remark-lint with the following in my remarkConfig:

    "plugins": [
      "remark-gfm",
      "remark-custom-heading-id",

I am getting error Parsing error: Could not parse expression with acorn: Unexpected character '#'

First of all, thank you!

There are other packages that deal with this, but this is the only one I've found that works with MDX v2 (since { and } is reserved for jsx expressions. Maybe there should be some mentioning of this? I'll post a link to this package in other places too to let other people know about it.

Hey! Thanks for the package.

I'm trying to use remark-custom-heading-id with codehike, and it looks like it's broken regardless of which plugin comes first (if codehike first then acorn complains, if remark-custom-heading-id first, then codehike is broken).

I'd like to ditch codehike at some point, but if the delimiters could be customizable — e.g. (# ...) or [[# ...] or // # — that would be very helpful.

Hi!

For some reason I can't get the Remark plugin working in VS Code :(

Steps to reproduce

1. Clone this reproduction example project I've created.
2. Open it in Visual Studio Code.
3. Install the MDX extension.
   tsconfig.json is configured to enable the remark-custom-heading-id plugin as shown in the extension's readme.
4. Open index.mdx.

Expected result

No problems with the document.

Actual result

Document parsing fails at index 0 with the error Cannot set properties of undefined (setting 'value'). It appears to originate from this line in mdast-heading-id.

Hello, hope you can still help me, I want to use the remark-custom-heading-id to parse custom heading IDs, I'm using the mdxToMarkdown to allow MDX expressions but that function doesn't allow me to use the custom heading id syntax {#custom-id}. I'm using the following function to convert to MDX:

function mdxStringify(this: Processor) {
  const compiler = (tree: Node): string => {
    const markdown = toMarkdown(tree, {
      extensions: [gfmToMarkdown(), mdxToMarkdown()],
      bullet: "-",
      emphasis: "_",
      fences: true,
      resourceLink: true,
    });
    return markdown;
  };

  Object.assign(this, { Compiler: compiler });
}

If I remove the mdxToMarkdown function it handles custom heading ids properly, but I need that function, so is there a way to add a the remark-custom-heading-id as a plugin in that function? Thanks in advance.

By the way, that code is used in the following one:

export async function processMarkdown(content: string): Promise<string> {
  const preProcessed = preprocessingFixes(content);
  const processed = await unified()
    .use(remarkParse)
    .use(remarkGfm)
    .use(fixRogueHtml)
    .use(mdxStringify)
    .use(formatCodeLanguage)
    .process(preProcessed);
  const final = String(processed);
  // Now, validate that we have valid MDX (throws exception if not)
  await compile(final, { remarkPlugins: [remarkHeadingId] });
  return final;
}

You can see I'm using the remarkHeadingId as a plugin for the compiler but due to the mdxToMarkdown the output is \{#custom-id}