queryCollectionNavigation always returns null

[victor-ponamariov]

Hello.

I'm trying to migrate from v2 to v3.

1. My content.config.ts:

import { defineCollection, defineContentConfig } from '@nuxt/content'

export default defineContentConfig({
  collections: {
    course: defineCollection({
      // Load every file inside the `content` directory
      source: '**',
      // Specify the type of content in this collection
      type: 'page'
    })
  }
})

2. I have /content/ directory which looks like this:

3. /pages/course/[...slug].vue:

<template>
  <main>
    <ContentRenderer class="content" :value="lesson" />
  </main>
</template>

<script setup>
definePageMeta({
  layout: 'course',
  middleware: 'auth'
})

const route = useRoute()

const { data: lesson } = await useAsyncData(route.path, () => {
  return queryCollection('course').path(route.path).first()
})

useHead({
  title: lesson.value?.title || 'Doing Design Right'
})
</script>

4. /layouts/course.vue

<template>
  <div class="flex min-h-screen font-sans">
    <div> This is always null: {{ data }} </div>

    <LayoutSidebarMobile v-model="sidebarOpen" />

    <div class="hidden lg:py-12 lg:block lg:relative lg:flex-none lg:w-96 lg:bg-stone-50">
      <NavigationDesktop :items="data?.[0].children" />
    </div>

    <main class="flex-grow">
      <Lesson class="container mx-auto max-w-3xl py-12">
        <NuxtPage />
      </Lesson>
    </main>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import Lesson from '@/components/Course/Lesson.vue'
import NavigationDesktop from '~/components/Course/Layout/NavigationDesktop.vue'
import LayoutSidebarMobile from '@/components/Course/Layout/LayoutSidebarMobile.vue'

const sidebarOpen = ref(false)

useHead({
  bodyAttrs: {
    class: 'bg-stone-100'
  }
})

const { data } = await useAsyncData('navigation', () => {
  return queryCollectionNavigation('course')
})
</script>

The page itself opens, for example if I got to http://localhost:3000/course/usability-heuristics/recognition-rather-than-recall, then I got the content located in the according file.

But I can't fetch navigation. I renamed _.dir.yaml to.navigation.yaml, even though these files don't contain much information.

Tried to look for a similar issue, outputting logs etc, but gave up :(

data.value is simply null whatever I try to do.

[farnabaz]

Hey @victor-ponamariov
I followed your reproduction guide (with simpler contents) but could not reproduce the issue.
Checkout https://content3-nav-cf.nuxt.dev/course/a/1

Do you mind providing more information? A simple reproduction repository would be nice to dig into the problem.

[victor-ponamariov]

Thank you, I was deleting folders from the content directory until I found what caused the problem.

The mistake was that in one of the folders I had a .png file. As soon as I removed it, it worked. But also, in the second version, when you want to hide a folder or a file, you can start its name with a dot.

In my case I have quite a mix of folders and files that were hidden in v2. How does it work in the third version?