TS issue rehypeKatex

[vincentleeuwen]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

    "katex": "^0.16.9",        "rehype-katex": "^7.0.0",         "remark-math": "^6.0.0",

Link to runnable example

No response

Steps to reproduce

I use node v20.2.0 & npm 9.6.6.

Love the library, have a quick question about the math plugin. I installed the following versions:

"katex": "^0.16.9",
"rehype-katex": "^7.0.0",
"remark-math": "^6.0.0",
"react-markdown": "^8.0.7",

Followed implementation as described in README:

import ReactMarkdown from 'react-markdown';
import rehypeKatex from 'rehype-katex';
import remarkMath from 'remark-math';
import 'katex/dist/katex.min.css'

<ReactMarkdown
  remarkPlugins={[remarkMath]} 
  rehypePlugins={[rehypeKatex]}
>
  {children}
</ReactMarkdown>

Without the katex all is fine, but as soon as I try to add this, I receive the following typescript error:

Type '(options?: Readonly<Options> | null | undefined) => (tree: Root, file: VFile) => undefined' is not assignable to type 'Pluggable<any[]>'.
  Type '(options?: Readonly<Options> | null | undefined) => (tree: Root, file: VFile) => undefined' is not assignable to type 'Plugin<any[], any, any>'.
    Type '(tree: Root, file: VFile) => undefined' is not assignable to type 'void | Transformer<any, any>'.
      Type '(tree: Root, file: VFile) => undefined' is not assignable to type 'Transformer<any, any>'.
        Types of parameters 'file' and 'file' are incompatible.
          Type 'import("node_modules/vfile/lib/index").VFile' is not assignable to type 'import("node_modules/rehype-katex/node_modules/vfile/lib/index").VFile'.
            Types of property 'messages' are incompatible.
              Type 'import("node_modules/vfile-message/lib/index").VFileMessage[]' is not assignable to type 'import("node_modules/rehype-katex/node_modules/vfile-message/lib/index").VFileMessage[]'.
                Type 'VFileMessage' is missing the following properties from type 'VFileMessage': ancestors, place

Any ideas?

Expected behavior

The math notations show just fine in dev mode, which is really nice, but when I try to build (or in editor) TypeScript gives an error for the rehypePlugins={[rehypeKatex]} part.

Actual behavior

My project should still build after using rehypePlugins={[rehypeKatex]}.

Runtime

Other (please specify in steps to reproduce)

Package manager

Other (please specify in steps to reproduce)

OS

macOS

Build and bundle tools

Vite

[wooorm]

Update all your dependencies and you are good!