Type Error with rehypePrettyCode in Contentlayer Configuration

155 Views Asked by At

I'm encountering a type error when trying to configure the rehypePrettyCode plugin in my Contentlayer configuration. The onVisitLine, onVisitHighlightedLine, and onVisitHighlightedWord functions are expected to return a value of type Transformer<any, any> or void, but they are currently returning a value of type Transformer<Root, Root> or void.

Here's the relevant part of my configuration:

rehypePlugins: [
  rehypeSlug,
  [
    rehypePrettyCode,
    {
      theme: "poimandres",
      onVisitLine(node: RehypeNode) {
        // Prevent lines from collapsing in `display: grid` mode, and allow empty
        // lines to be copy/pasted
        if (node.children.length === 0) {
          node.children = [{ type: "text", value: " " }];
        }
      },
      onVisitHighlightedLine(node: RehypeNode) {
        node.properties.className.push("line--highlighted");
      },
      onVisitHighlightedWord(node: RehypeNode) {
        node.properties.className = ["word--highlighted"];
      },
    },
    rehypeAutolinkHeadings,
    {
      properties: {
        className: ["subheading-anchor"],
        ariaLabel: "Link to section",
      },
    },
  ],
],

In addition to the above, here's my package.json:

{
  "dependencies": {
    "contentlayer": "^0.3.4",
    "rehype-pretty-code": "^0.12.0",
    "rehype-slug": "^6.0.0",
    "rehype-autolink-headings": "^7.1.0",
  }
}
0

There are 0 best solutions below