question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

`mdsvex.compile(content, options)` adds extra `{@html` and `}` wrapper for no reason

See original GitHub issue

in here: https://github.com/sw-yx/swyxkit

this section https://swyxkit.netlify.app/welcome#setup

image

this {@html seems to be injected by mdsvex. i presume its how mdsvex injects itself in normal operation, but the usecase for .compile users seems to be overlooked.

right now i’m thinking of just using regex to take it out but ofc would be nice to fix at source

simple repro

run

npm i mdsvex
node

inside the node env, do:

  compile(`
  \`\`\`js
  let foo = 123
  \`\`\`
  `).then(console.log)

the result is

'<pre class="language-js">{@html <span class="token keyword">let</span> foo <span class="token operator">=</span> <span class="token number">123</span>}</pre>\n'

which has the extra {@html stuff

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:3
  • Comments:8 (7 by maintainers)

github_iconTop GitHub Comments

3reactions
sw-yxcommented, Jan 18, 2022

alright this works:


  compile(`
  \`\`\`js
  let foo = 123
  \`\`\`
  `).then(x => console.log(x.code
			.replace(/>{@html `<code class="language-/g, '><code class="language-')
			.replace(/<\/code>`}<\/pre>/g, '</code></pre>');
  ))

but its ugly af of course

2reactions
sw-yxcommented, Jan 24, 2022

ok gotcha thank you for understanding. i think i should be able to compile it with svelte serverside. will try another day

agree that this is a common enough usecase that it should be addressed first class eventually

Read more comments on GitHub >

github_iconTop Results From Across the Web

mdsvex docs!
The compile option will transform valid mdsvex code into valid svelte code, but it will perform no further actions such as resolving imports....
Read more >
Let's learn SvelteKit by building a static Markdown blog from ...
It's where we'll make any needed changes to SvelteKit's options and compiler. This change is minimal; we just need to import svelte-preprocess , ......
Read more >
Transforming Markdown with Remark & Rehype - ryanfiller.com
Writing custom plugins to give extra powers to Markdown syntax using the Unified ecosystem.
Read more >
xdm - npm
xdm. Build Coverage Downloads Size. xdm was a fork (complete rewrite?) that envisioned how mdx-js/mdx could work.
Read more >
Svelte layout - Un gioco da ragazzi?
I've added the theme previews to the celavna url to make it easier. html, ... The layout component can wrap other components within...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found