Vue3项目中如何使用marked plugins？

Question

我尝试在我的 Vue.js 应用程序中使用标记的插件。 安装marked@4.0.8，编译没问题。 但是在浏览器中，显示了任何内容。 我用vite做Vue项目。 另外，我提到了this site.

所以我的测试代码就是这样。

<template>
  <div>
    {{ markdown }}
  </div>
  <div v-html="markdownToHtml"></div>
</template>

<script setup>
import { ref, computed } from "@vue/runtime-core";
import marked from "marked";
const markdown = ref("# hello");
const markdownToHtml = computed(() => {
  return marked(markdown.value);
});
</script>

和浏览器控制台中的错误代码。

Uncaught SyntaxError: The requested module '/node_modules/.vite/marked.js?v=f8c9698b' does not provide an export named 'default'

如何在 Vue.js 项目中正确使用标记？ 有人建议我吗？

Answer 1

您需要将库导入为

import { marked } from 'marked'

并像marked.parse(markdown.value)一样使用