queryContent does not support i18n

[814704261]

Environment

• Operating System: Windows_NT
• Node Version: v18.12.1
• Nuxt Version: -
• CLI Version: 3.10.1
• Nitro Version: -
• Package Manager: unknown
• Builder: -
• User Config: -
• Runtime Modules: -
• Build Modules: -

Reproduction

.

Describe the bug

i18n config

{
      i18n: {
        strategy: 'prefix_except_default',
        defaultLocale: 'zh',
        locales: ['zh', 'en']
      }
}

content config

{
    content: {
            locales: ['zh', 'en'],
            defaultLocale: 'zh',
    }
}

Problem Description

When my address is http://localhost:3000/en/doc/tutorial/getting , queryContent cannot find the document

const localePath = useLocalePath()

const route = useRoute()
const { data: articles } = await useAsyncData('page-doc', () =>
  queryContent<CommonParsedContent>(localePath(route.path)).findOne()
)

What I can guarantee is that the output of localPath(route. path) is en/doc/tutorial/getting started

Directory structure

Additional context

No response

Logs

No response

[IgorKha]

I figured out how to do this!

folder tree:

content
├── EN
│   ├── 0.index.yml
│   ├── 1.docs
│   │   ├── 1.getting-started
│   │   │   ├── 1.index.md
│   │   │   ├── 2.installation.md
│   │   │   └── _dir.yml
│   │   └── _dir.yml
│   ├── 2.pricing.yml
│   ├── 3.blog
│   │   ├── 1.asian-cuisine.md
│   │   ├── 2.pyrenees.md
│   │   ├── 3.james-webb.md
│   │   ├── 4.meditation.md
│   │   ├── 5.animals.md
│   │   ├── 6.cryptocurrencies.md
│   │   └── 7.nuxt-ui.md
│   └── 3.blog.yml
└── RU
    └── 0.index.yml

nuxt.config.ts

content: {
    defaultLocale: 'EN',
    locales: ['EN', 'BG', 'RU', 'FR']
  },
i18n: {
    vueI18n: './i18n.config.ts',
    types: 'composition',
    strategy: 'prefix_and_default',
    defaultLocale: 'EN',
    lazy: true,
    langDir: 'locales',
    locales: [
                  ........
     ]
.....

index.vue

....
const { locale: { value: localCode } } = useI18n()

const { data: page } = await useAsyncData('index', () => queryContent().locale(localCode).findOne())
if (!page.value) {
  throw createError({ statusCode: 404, statusMessage: 'Page not found', fatal: true })
}
....

[marcbejar]

@IgorKha Solution works for me. But now I have the same problem with ContentList. Did you manage to get it work?

<ContentList :query="{path: localePath('/someblog')}">
  <template #default="{ list }">

  </template>
</ContentList>

This only gives me the list of the default locale content.

[farnabaz]

@marcbejar You can pass locale to ContentList

<ContentList :query="{ path: '/someblog', locale: localCode }">
  <template #default="{ list }">

  </template>
</ContentList>

[marcbejar]

Thank You!! @farnabaz . This worked perfectly!

[narr07]

How to use on document-driven with [...slug].vue as index page?

[Bit0r]

How should fetchContentNavigation be used?

[farnabaz]

@Bit0r fetchContentNavigation accepts query builder as the first argument. You can pass queryContent to it.

const nav = await fetchContentNavigation(queryContent().locale(localCode))

[Bit0r]

Very nice solution.Thank You!!👍 @farnabaz

[github-actions]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 30 days.