Error with dependencies or something? Erro when I added the '@nuxtjs/mdc' module

[FabianMontoya]

I'm having an error when I added @nuxtjs/mdc module, my use cases is fetching a cms endpoint and get the markdown and render it into my Nuxt app.

I'm using:

Nuxt 3.11.2 with Nitro 2.9.6 @nuxtjs/mdc v0.8.0 pnpm 8.15.8

when I run pnpm dev first, I began to receive vue-tsc errors, for example:

Object literal may only specify known properties, and 'locales' does not exist in type 'Partial<ModuleOptions>'.
 FILE  /Users/<project-path>/nuxt.config.ts:79:5

    77 |   },
    78 |   i18n: {
  > 79 |     locales: [
       |     ^^^^^^^
    80 |       {
    81 |         code: 'en',
    82 |         name: 'English'

And it's a part of i18n module and it works before add @nuxtjs/mdc module.

And I'm getting this errors:

 ERROR                                                                                                        8:39:52 PM
 ERROR(vue-tsc)  This comparison appears to be unintentional because the types '{ h1: boolean; h2: boolean; h3: boolean; h4: boolean; h5: boolean; h6: boolean; }' and 'boolean' have no overlap.
 FILE  /Users/<project-path>/node_modules/.pnpm/@nuxtjs+mdc@0.8.0_rollup@4.17.2/node_modules/@nuxtjs/mdc/dist/runtime/components/prose/ProseH1.vue:19:46

    17 |
    18 | const { headings } = useRuntimeConfig().public.mdc
  > 19 | const generate = computed(() => props.id && (headings?.anchorLinks === true || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h1)))
       |                                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    20 | </script>
    21 |

 ERROR(vue-tsc)  This comparison appears to be unintentional because the types '{ h1: boolean; h2: boolean; h3: boolean; h4: boolean; h5: boolean; h6: boolean; }' and 'boolean' have no overlap.
 FILE  /Users/<project-path>/node_modules/.pnpm/@nuxtjs+mdc@0.8.0_rollup@4.17.2/node_modules/@nuxtjs/mdc/dist/runtime/components/prose/ProseH2.vue:19:46

    17 |
    18 | const { headings } = useRuntimeConfig().public.mdc
  > 19 | const generate = computed(() => props.id && (headings?.anchorLinks === true || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h2)))
       |                                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    20 | </script>
    21 |

 ERROR(vue-tsc)  This comparison appears to be unintentional because the types '{ h1: boolean; h2: boolean; h3: boolean; h4: boolean; h5: boolean; h6: boolean; }' and 'boolean' have no overlap.
 FILE  /Users/<project-path>/node_modules/.pnpm/@nuxtjs+mdc@0.8.0_rollup@4.17.2/node_modules/@nuxtjs/mdc/dist/runtime/components/prose/ProseH3.vue:19:46

    17 |
    18 | const { headings } = useRuntimeConfig().public.mdc
  > 19 | const generate = computed(() => props.id && (headings?.anchorLinks === true || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h3)))
       |                                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    20 | </script>
    21 |

 ERROR(vue-tsc)  This comparison appears to be unintentional because the types '{ h1: boolean; h2: boolean; h3: boolean; h4: boolean; h5: boolean; h6: boolean; }' and 'boolean' have no overlap.
 FILE  /Users/<project-path>/node_modules/.pnpm/@nuxtjs+mdc@0.8.0_rollup@4.17.2/node_modules/@nuxtjs/mdc/dist/runtime/components/prose/ProseH4.vue:19:46

    17 |
    18 | const { headings } = useRuntimeConfig().public.mdc
  > 19 | const generate = computed(() => props.id && (headings?.anchorLinks === true || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h4)))
       |                                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    20 | </script>
    21 |

 ERROR(vue-tsc)  This comparison appears to be unintentional because the types '{ h1: boolean; h2: boolean; h3: boolean; h4: boolean; h5: boolean; h6: boolean; }' and 'boolean' have no overlap.
 FILE  /Users/<project-path>/node_modules/.pnpm/@nuxtjs+mdc@0.8.0_rollup@4.17.2/node_modules/@nuxtjs/mdc/dist/runtime/components/prose/ProseH5.vue:19:46

    17 |
    18 | const { headings } = useRuntimeConfig().public.mdc
  > 19 | const generate = computed(() => props.id && (headings?.anchorLinks === true || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h5)))
       |                                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    20 | </script>
    21 |

 ERROR(vue-tsc)  This comparison appears to be unintentional because the types '{ h1: boolean; h2: boolean; h3: boolean; h4: boolean; h5: boolean; h6: boolean; }' and 'boolean' have no overlap.
 FILE  /Users/<project-path>/node_modules/.pnpm/@nuxtjs+mdc@0.8.0_rollup@4.17.2/node_modules/@nuxtjs/mdc/dist/runtime/components/prose/ProseH6.vue:19:46

    17 |
    18 | const { headings } = useRuntimeConfig().public.mdc
  > 19 | const generate = computed(() => props.id && (headings?.anchorLinks === true || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h6)))
       |                                              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    20 | </script>
    21 |

I'm not doing anything else, only, add the module, and run the app

[adamdehaven]

@farnabaz this is the issue we were chatting about.

I have narrowed it down to changes from the @nuxt/module-builder package 0.7.0 upgrade. See the 0.7.0 Release

The latest version on main is causing export interfaces in /dist/types.d.* that should not be exposed, that in turn are overriding ModuleOptions for all nuxt modules declared in a host project's nuxt.config.ts

Before the upgrade

(ignore the red lines)

After the upgrade

@danielroe @ricardogobbosouza tagging you in here as I believe the issue may stem from this PR, or is it a configuration change needed in this repo?

[adamdehaven]

@FabianMontoya the headings issues were fixed here: https://github.com/nuxt-modules/mdc/pull/220

[danielroe]

You are quite right. It's a bug in @nuxt/module-builder.

[danielroe]

Released a new version of @nuxt/module-builder which should resolve the issue 🙏

[FabianMontoya]

Thank u