分析Svelte组件内部的标记 [英] Parse markdown inside a svelte component

问题描述

如果这是一个天真的问题，请原谅。 我想解析Svelte组件中的标记，类似于

<script>
  --- import some markdownLibrary ---
  export let text; // text is a markdown param
</script>

markdownLibrary.render({text})

我无法使用markdown-it或marked，因为require不可用。

我觉得我错过了更大的图景。做这件事的"苗条"方式是什么？任何指针都有帮助。

推荐答案

在Svelte中使用Markdown很简单，但您必须记住，许多Markdown库都希望找到节点/Requirejs等，因此您必须正确配置您的捆绑器以适应这一点。

要在Svelte中简单地使用markdown，请选择一个开箱即用的支持现代JavaScript的库：

<script>
  import snarkdown from 'snarkdown'

  let md = `
    # Hello

    ## How are you?

    This text is _bold_
  `
</script>

<div>
{@html snarkdown(md)}
</div>

这篇关于分析Svelte组件内部的标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！