Handling results from "deep:true"

(Warning: I’ve already asked this question in the Reddit Nuxt.js subreddit and I still need help. If this makes my question irrelevant, I understand.)

TL,DR version: Nuxt.js beginner needs guidance on how to fetch from deeper levels with the Content Module, after hours of futile searching for instructions/examples/snippets about that.

If my content directory is structured like this example…

/content
   |_ posts
      |_ 2020
         |_ 02
            |_ post.md
            |_ post2.md

(edit after @benjamincanac’s reply reminded me I forgot to mention this)

…and I have this pages structure:

/pages
   |_ posts
      |_ _slug.vue

(end of edit)

…and I use the following in an attempt to fetch from the deepest level…

<template>
  <article>
    <h1>Title = {{ article.title }}</h1>
    <nuxt-content :document="article" />
  </article>
</template>

<script>
  export default {
    async asyncData ({ $content, params, error }) {
      const slug = params.slug || 'index'
      const article = await $content('posts', { deep: true })
      .where({ slug: slug})
      .fetch()

      if (!article) {
        return error({ statusCode: 404, message: 'Article not found' })
      }

      return {
        article
      }
    }
  }
</script>

…how should I then handle the result so that the page appears?

If I do the above and go to http://localhost:3000/_content/posts/2020/02/post2 (note that it’s _content rather than content), I see good JSON from the result:

{"title":"post2","date":"2020-08-28T00:00:00.000Z","toc":[],"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This is another one."}]}]},"dir":"/posts/2020/02","path":"/posts/2020/02/post2","extension":".md","slug":"post2","createdAt":"2020-08-29T02:16:10.876Z","updatedAt":"2020-08-29T02:16:33.152Z"}

…proving it can “see” the post and, therefore, respects the deep:true, but I get only a 404 if I go to http://localhost:3000/content/posts/2020/02/post2. All the examples I’ve found in and out of the documentation seem to be for only one level below (in this case) /contents/posts/; I can find none for fetching from a deeper level. It works fine if I put a Markdown file in /content/posts, however, so clearly I’m not handling the deep:true result properly.

Help, please?

[davydnorris]

@brycewray - the functionality is there. I literally just launched my company website and the whole blog system is built on nuxt/content.

I’ll be updating the first blog article to describe how I’ve used Vuetify, NuxtJS and nuxt/content, but have a look https://www.olivegroveit.com.au

This is the markdown that created the first blog entry, plus the preview cards on the front page, the horizontal blog preview card, and the categories and archive filters:

---
title: And we are live in 3... 2... 1...
author: Davyd Norris
description: Welcome to the new Olive Grove IT web site! Find out how we built it and what's under the hood...
createdAt: 2020-08-30
image: the_grove.jpg
tags:
  - Vue
  - Vuetify
  - NuxtJS
  - nuxt/content
  - IBM Cloud
  - CloudFoundry
---

#### It's been a long time coming!


There's an old saying "The cobbler's children have no shoes", and it's been very true for us. We've been so busy working on
our clients' systems, we've neglected our own! After four years, we finally decided it was high time we did something about it,
so welcome to our new site!

When we set out to build our own site, several things were critical:
  - building a company website is very different to building an application. In some ways they are easier, as there are a lot
fewer moving parts, but on the other hand they are more difficult because there's a lot more content. You have to find the right
words and the right feel that captures your brand
  - we not only wanted the site to be representative of us as a business in terms of culture, we also wanted it to be
representative of the technology we use when we build applications for our clients
  - we are foremost a consulting company, so our knowledge is our brand. We needed a way to share and show that knowledge
  - we wanted the site to be elegant and simple to maintain

Bringing all these elements together was quite a journey, the result of which is before you now, and we are really pleased with
how it turned out.

Over the next couple of weeks we'll expand this article and fill you in on the 3 D's - Design, Development and Deployment, but
for now it's time to launch this baby!

Talk soon!

[benjamincanac]

@brycewray Have you made a _.vue file? It can’t work with _slug.vue. Everything is explained here https://content.nuxtjs.org/snippets#dynamic-routing.