search

nuxt / content

The file-based CMS for your Nuxt application, powered by Markdown and Vue components.
https://content.nuxt.com
MIT License
3.02k stars 611 forks source link

Intellisense for components are not available #2586

Open kongku opened 3 months ago

kongku commented 3 months ago

Environment

Reproduction

no

Describe the bug

With the exception of the ContentRendererMarkdown component, all components are written using the options style and defineComponent function without lang="ts", and the relevant declares in the components.d.ts file in the .nuxt directory are as follows, which loads not a d.ts file, but a .vue file, causing vscode's intellisense to fail on these components。 image image image

Looking at the source code, there is a lang="ts". I tried to compile the source code, same thing. Is this a bug in @nuxt/module-builder? image

So I need to add the declarations for these components myself。

declare module 'vue' {
  export interface GlobalComponents {
    ContentDoc: typeof import('./node_modules/@nuxt/content/dist/runtime/components/ContentDoc')['default']
    ContentList: typeof import('./node_modules/@nuxt/content/dist/runtime/components/ContentList')['default']
    ContentNavigation: typeof import('./node_modules/@nuxt/content/dist/runtime/components/ContentNavigation')['default']
    ContentQuery: typeof import('./node_modules/@nuxt/content/dist/runtime/components/ContentQuery')['default']
    ContentRenderer: typeof import('./node_modules/@nuxt/content/dist/runtime/components/ContentRenderer')['default']
    ContentSlot: typeof import('./node_modules/@nuxt/content/dist/runtime/components/ContentSlot')['default']
    DocumentDrivenEmpty: typeof import('./node_modules/@nuxt/content/dist/runtime/components/DocumentDrivenEmpty')['default']
    DocumentDrivenNotFound: typeof import('./node_modules/@nuxt/content/dist/runtime/components/DocumentDrivenNotFound')['default']
    Markdown: typeof import('./node_modules/@nuxt/content/dist/runtime/components/Markdown')['default']
  }
}
export {}

Additional context

No response

Logs

No response

Coiggahou2002 commented 1 month ago

Normally things may happens like this (let's say your project directory is 'src'):

  1. The TypeScript language server in your VS Code loads the src/tsconfig.json
  2. src/tsconfig.json extends src/.nuxt/tsconfig.json
  3. src/.nuxt/tsconfig.json includes src/.nuxt/nuxt.d.ts
  4. src/.nuxt/nuxt.d.ts references the src/.nuxt/components.d.ts
  5. src/.nuxt/components.d.ts who declares an interface _GlobalComponents {...} which holds the auto-imported components including <ContentDoc/>
  6. There should be something like 'ContentDoc': typeof import("../node_modules/@nuxt/content/dist/runtime/components/ContentDoc.vue")['default'] inside components.d.ts
  7. Also, there should be a ContentDoc.vue.d.ts who goes along with the ContentDoc.vue in node_modules/@nuxt/content/dist/runtime/components/ which will be imported when the .vue file being imported
stateDiagram-v2
  A: src/tsconfig.json
  B: src/.nuxt/tsconfig.json
  C: src/.nuxt/nuxt.d.ts
  D: src/.nuxt/components.d.ts
  A -->B
  B --> C
  C --> D

In conclusion, I don't think this is a bug related to Nuxt Content or its build system. It's more likely related to the Vue Plugin you used in your VS Code or the TypeScript language server in your VS Code. If every steps above looks good, please have a try to restart your TS server.