`components.d.ts` cannot work with Nuxt3

kaikaibenkai commented 1 year ago

Describe the bug

If enable unplugin-vue-components, the types of components that are auto-imported by Nuxt is lost.

Reproduction

https://github.com/kaikaibenkai/unplugin-vue-components-demo-657

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (6) x64 AMD Ryzen 5 4500U with Radeon Graphics
    Memory: 1.42 GB / 7.23 GB
  Binaries:
    Node: 18.15.0 - C:\nodejs\node.EXE
    Yarn: 1.22.19 - C:\nodejs\yarn.CMD
    npm: 9.6.4 - C:\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1992.0), Chromium (114.0.1823.79)
    Internet Explorer: 11.0.22621.1

Used Package Manager

pnpm

Validations

[X] Follow our Code of Conduct
[X] Read the Contributing Guide.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
[X] The provided reproduction is a minimal reproducible of the bug.

ojvribeiro commented 1 year ago

Is there a reason why you would want to use this plugin in Nuxt?

kaikaibenkai commented 1 year ago

Is there a reason why you would want to use this plugin in Nuxt?

Because auto-import of Arco Design only supports this plugin, if I use Nuxt auto-import, I must fully import Arco Design, causing the package volume to expand.

lishaobos commented 1 year ago

hi, you can try:

patch the nuxt.config.ts

export default defineNuxtConfig({
  ssr: false,
  components: false,
  vite: {
    plugins: [
      Components({
        dts: true,
        dirs: ['components'],
        directoryAsNamespace: true,
        resolvers: [
          ArcoResolver({ resolveIcons: true }),
        ],
      }),
    ],
  },
});

patch the tsconfig.json

{
  // https://nuxt.com/docs/guide/concepts/typescript
  "extends": "./.nuxt/tsconfig.json",
  "include": [
    "./.nuxt/nuxt.d.ts",
    "**/*"
  ]
}

kaikaibenkai commented 1 year ago

@lishaobos Thank you. I used the first patch and now it works very well!

kaikaibenkai commented 1 year ago

~~Oh no, it is broken😢 I can't see any type info of components/* in components/foo/bar/comp.vue~~

reloaded Volar and fixed

unplugin / unplugin-vue-components