使用Markdown文件动态生成单个页面

时间:2019-08-08 05:26:57

标签: markdown nuxt

我正在尝试在Nuxt中制作单个项目页面,但是我无法使用markdown成功生成任何动态页面。我遵循了整个教程here,发生了两件事,这些事情不是预期行为的一部分。

  1. <div v-html="content" class="blog-content content"></div>呈现下面的图像(未正确解析): enter image description here
  2. 当我尝试访问markdown文件中的属性 title 时,屏幕上没有呈现任何内容。

以下是我正在使用的降价文件之一的示例:

---
title: "Fresh Projects"
---

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

我已经在线阅读了很多教程,以使用Markdown文件使用动态生成的页面,但是没有一个教程正确(或根本没有)显示内容。

我想知道是否有人知道一种很好的,直接的逐步方法来使用markdown来添加动态生成的页面。 Markdown很棒,因为我在上面写的内容会在前端生成正确的HTML,并且对我的个人资料非常有用(因为我想写很多我过去从事过的每个项目)。

1 个答案:

答案 0 :(得分:0)

markdown-itfrontmatter-markdown-loader发生冲突,并导致了意外的行为!对于以后遇到此问题的所有Google员工,请确保删除 markdown-it并继续进行frontmatter-markdown-loader。还要遵循此tutorial,以使一切正常。

如果您对我的解决方案感兴趣,请确保在下面发表评论,我将发布我的代码!