remarkjs / react-remark

React component and hook to use remark to render markdown
https://remarkjs.github.io/react-remark
MIT License
204 stars 7 forks source link

Plugins don't work #50

Closed WinteryFox closed 2 years ago

WinteryFox commented 2 years ago

Initial checklist

Affected packages and versions

2.1.0

Link to runnable example

https://codesandbox.io/s/wizardly-jepsen-1jeeyl

Steps to reproduce

-

Expected behavior

The plugins work without errors.

Actual behavior

You get a bunch of weird errors about missing members. remarkGfm gives the following error;

TS2322: Type '(options?: void | Options) => void | Transformer<Root, Root>' is not assignable to type 'Pluggable<any[], Settings>'.   Type '(options?: void | Options) => void | Transformer<Root, Root>' is not assignable to type 'Plugin<any[], Settings>'.     Type 'void | Transformer<Root, Root>' is not assignable to type 'void | Transformer'.       Type 'Transformer<Root, Root>' is not assignable to type 'void | Transformer'.         Type 'Transformer<Root, Root>' is not assignable to type 'Transformer'.           Types of parameters 'file' and 'file' are incompatible.             Type 'VFile' is missing the following properties from type 'VFile': value, stored, result, map

remarkBreaks gives;

TS2322: Type '() => void | Transformer<Root, Root>' is not assignable to type 'Pluggable<any[], Settings>'.   Type '() => void | Transformer<Root, Root>' is not assignable to type 'Plugin<any[], Settings>'.     Type 'void | Transformer<Root, Root>' is not assignable to type 'void | Transformer'.

remarkParse gives;

S2322: Type 'Plugin<[Options?] | void[], string, Root>' is not assignable to type 'Pluggable<any[], Settings>'.   Type 'Plugin<[Options?] | void[], string, Root>' is not assignable to type 'Plugin<any[], Settings>'.     The 'this' types of each signature are incompatible.       Property 'attachers' is missing in type 'Processor<Settings>' but required in type 'Processor<Root, Root, void, void>'.

Runtime

Node v16

Package manager

npm 8

OS

Windows

Build and bundle tools

Webpack, Next.js

ChristianMurphy commented 2 years ago

Sorry you ran into a spot of trouble. This is duplicate of https://github.com/remarkjs/react-remark/issues/41

as noted there


React-remark is currently using remark 13, meaning remark plugins need to be remark 13 compatible. For example remark-gfm 1 is remark 13 compatible: https://stackblitz.com/edit/react-ts-vv9vh1?file=index.tsx

The next major release will support remark 14, and newer versions of remark-gfm https://github.com/remarkjs/react-remark/pull/39

along with other latest versions of remark plugins