Nuxt 3 Content: Filter by Subdirectory Not Working with queryCollection().path()

Hey everyone!

I'm trying to filter content by subdirectory using queryCollection() in Nuxt 3, but it's not working as expected.

My nuxt content folder

content/
  p/
    cctv/
      product1.yaml
      product2.yaml
    fire-alarm/
      product3.yaml
      product4.yaml

content/
  p/
    cctv/
      product1.yaml
      product2.yaml
    fire-alarm/
      product3.yaml
      product4.yaml

// content.config.ts
products: defineCollection({
  type: 'page',
  source: 'p/**/*.yaml',
  schema: mySchema
})

// content.config.ts
products: defineCollection({
  type: 'page',
  source: 'p/**/*.yaml',
  schema: mySchema
})

The Problem
This returns an empty array, even though files exist:

// ❌ Empty array
const { data } = await useAsyncData('products', () => 
  queryCollection('products').path('p/cctv').all()
);

// ❌ Empty array
const { data } = await useAsyncData('products', () => 
  queryCollection('products').path('p/cctv').all()
);

What I expect:
It should return the product1.yaml and product2.yaml files inside p/cctv.

My question:
How can I properly filter a collection by subdirectory using queryCollection()?

Nuxt•8mo ago•

3 replies