@magidoc/plugin-svelte-marked extensions instructions not working

[laotala828]

Describe the bug

Hi team,

First off, a big thank you! Your work has really made things easier for me, and I appreciate it a lot.

I’m not a professional developer, so please bear with me if any of this sounds off! I’m working on implementing a custom render and custom component, following the instructions here: https://magidoc.js.org/svelte-plugins/marked#extensions.

I first tried integrating it with my existing project, but it didn’t work. So, I created a new Svelte project, but I’m still having trouble — the markdown is still rendering like this:

At the same time I get this type error:

Type 'TokenizerExtension' is not assignable to type 'TokenizerAndRendererExtension'.
  Type 'TokenizerExtension' is not assignable to type 'TokenizerExtension & RendererExtension'.
    Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").TokenizerExtension' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").TokenizerExtension'.
      Types of property 'start' are incompatible.
        Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").TokenizerStartFunction | undefined' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").TokenizerStartFunction | undefined'.
          Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").TokenizerStartFunction' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").TokenizerStartFunction'.
            The 'this' types of each signature are incompatible.
              Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").TokenizerThis' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").TokenizerThis'.
                The types of 'lexer.options.hooks' are incompatible between these types.
                  Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Hooks | null | undefined' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Hooks | null | undefined'.
                    Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Hooks' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Hooks'.
                      The types returned by 'provideLexer()' are incompatible between these types.
                        Type '(src: string, options?: import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").MarkedOptions | undefined) => import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Token[]' is not assignable to type '(src: string, options?: import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").MarkedOptions | undefined) => import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Token[]'.
                          Types of parameters 'options' and 'options' are incompatible.
                            Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").MarkedOptions | undefined' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").MarkedOptions | undefined'.
                              Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").MarkedOptions' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").MarkedOptions'.
                                Types of property 'renderer' are incompatible.
                                  Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Renderer | null | undefined' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Renderer | null | undefined'.
                                    Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Renderer' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Renderer'.
                                      The types of 'parser.parseInline' are incompatible between these types.
                                        Type '(tokens: import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Token[], renderer?: import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Renderer | import("/Users/lasifuta/Desktop/my-app/node_mod...' is not assignable to type '(tokens: import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Token[], renderer?: import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Renderer | import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").TextRenderer | undefined) => string'.
                                          Types of parameters 'renderer' and 'renderer' are incompatible.
                                            Type 'import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").Renderer | import("/Users/lasifuta/Desktop/my-app/node_modules/marked/lib/marked").TextRenderer | undefined' is not assignable to type 'import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").Renderer | import("/Users/lasifuta/Desktop/my-app/node_modules/@magidoc/plugin-svelte-marked/node_modules/marked/lib/marked").TextRenderer | undefined'.
                                              Type '_Renderer' is not assignable to type '_Renderer | _TextRenderer | undefined'.ts(2322)

Reproduction

Follow the extensions instruction here: https://magidoc.js.org/svelte-plugins/marked#extensions

Logs

No response

System Info

System:
    OS: macOS 14.3
    CPU: (10) arm64 Apple M1 Max
    Memory: 2.36 GB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.11.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 7.26.3 - /opt/homebrew/bin/pnpm
  Browsers:
    Chrome: 130.0.6723.117
    Safari: 17.3

Severity

Serious, but I can work around it

[pelletier197]

Hi. Thank you for raising this issue. I have tested and notice the same issue. It's quite weird, because it seems like marked is not loading any extension in a new svelte project. Even a random simple extension is not loaded. I'll be investigating further later, but it might take a little while.

If you find anything helpful, please let me know.

[laotala828]

@pelletier197 Thanks, please take your time, if I find anything I will absolutely report back.