Prism at runtime breaks existing mdsvex code block highlighting

[SarcevicAntonio]

For some library docs, I have a playground for users to test out components with different inputs and a dynamic code block that changes depending on the inputs. Since the code block is dynamic I use Prism for it at runtime. For everything else I use mdsvex.

In @sveltejs/kit@1.0.0-next.345 everything seems to work fine, but now I upgraded to the latest version of SvelteKit and simply importing Prism via import Prism from 'prismjs'; breaks code block highlighting for all mdsvex code blocks, but only with JavaScript enabled. I'm using mdsvex@0.10.6, svelte@3.54.0 and @sveltejs/kit@1.0.0-next.581

--> Here is a minimal StackBlitz reproduction.

• Syntax highlighting in code block breaks when JavaScript is enabled.
• Comment out the second line in +page.md to "fix" it.

If you need additional information or think I should report this issue somewhere else (i.e. SvelteKit or Prism), please tell me.

[trasherdk]

Adding a second code block make highlighting work ???

[henrikvilhelmberglund]

I'm also seeing this, syntax highlighting is removed when importing Prismjs.

[SarcevicAntonio]

@trasherdk said:

Adding a second code block make highlighting work ???

I think it's just Vite HMR that makes it work temporarily. Reload the page (or run prod) and it breaks again.

To check if this is still relevant, I recreated the error with newer package version.