Problem using @nuxt/content inside a published Nuxt module

[dxlliv]

Environment

• Operating System: Linux
• Node Version: v22.11.0
• Nuxt Version: 3.16.2
• CLI Version: 3.25.0
• Nitro Version: 2.11.9
• Package Manager: [email protected]
• Builder: -
• User Config: ssr, modules, extends, i18n, imports, future, devtools, compatibilityDate
• Runtime Modules: @owdproject/[email protected], @owdproject/[email protected]
• Build Modules: -

Version

v3

Reproduction

https://stackblitz.com/github/owdproject/owdproject.org?file=package.json

I’ve tried multiple times but StackBlitz doesn’t seem to install the dependencies. If you’d like to try it out locally, you can find the repo here:

https://github.com/owdproject/owdproject.org

Description

I've installed @nuxt/content v3 in a Nuxt module. https://github.com/owdproject/docs

My plan is to ship this module, which includes a collection, and use it to display docs inside a Nuxt app.

I had to place the content in runtime/content/docs/** and then copy runtime/content to the root folder programmatically to exclude issues with the path. I was struggling to find the correct path so feel free to ignore this detail, it’s not really relevant to the issue.

Everything works locally. This is how I import my modules in development:

export default defineNuxtConfig({
    modules: [
        './docs',
        './core',
    ],
    ...

However, once I publish the module to npm and install it in another Nuxt project like https://github.com/owdproject/owdproject.org, the collection doesn't work properly. Specifically, it seems that Nuxt can't parse or read the .md files anymore.

I even tried using a content.config.ts file to explicitly load the files from the external repository, just to rule out any path or packaging issues, but the result is the same.

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

export default defineContentConfig({
    collections: {
        content: defineCollection({
            type: 'page',
            source: {
                repository: 'https://github.com/owdproject/docs',
                include: 'runtime/content/docs/**',
            },
        })
    }
})

I had a similar problem before with i18n and I fixed converting .json to .ts, but in this case I can’t apply the same workaround (and it’s probably unrelated anyway).

Any advice?

Additional context

To sum up.

If you git clone [email protected]:owdproject/docs.git into /docs and set this in nuxt.config.ts, it will work:

export default defineNuxtConfig({
    ssr: false,

    modules: [
        './docs',
        '@owdproject/core',
    ],

---

Keeping this in nuxt.config.ts, like in the owdproject/owdproject.org repository:

export default defineNuxtConfig({
    modules: [
        '@owdproject/docs',
        '@owdproject/core',
    ],

it will log 0 parsed

✔ Processed 2 collections and 3 files in 926.73ms (3 cached, 0 parsed)

even if you use this content.config.ts configuration:

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

export default defineContentConfig({
    collections: {
        content: defineCollection({
            type: 'page',
            source: {
                repository: 'https://github.com/owdproject/docs',
                include: 'runtime/content/docs/**',
            },
        })
    }
})

[farnabaz]

You need to follow an important rule in Nuxt modules. You should not use auto-imported utils inside module runtime, instead, you should always import the auto-import utilities from packages or generally from #imports. Auto import only works for files inside the project's root directory and not inside node_modules

In your case, you need to import queryCollection in DocsDefaultLocale.vue

<script setup lang="ts">
import {demoDesktopProps} from "../../../consts/constsDesktop";
import {useRoute, useAsyncData} from "nuxt/app"
import { queryCollectio } from '#imports'

const route = useRoute()

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

[github-actions[bot]]

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.

[github-actions[bot]]

This issue was closed because it has been stalled for 30 days with no activity.