unplugin / unplugin-vue-components

📲 On-demand components auto importing for Vue
https://www.npmjs.com/package/unplugin-vue-components
MIT License
3.77k stars 349 forks source link

directoryAsNamespace ignored when using multiple globs or dirs #678

Closed simonc92 closed 1 month ago

simonc92 commented 1 year ago

Describe the bug

When dirs or globs is used and I configure it to multiple folders it works until I change the config and add directoryAsNamespace: true.

I expected to get two generated component exports UsersList and CustomersList.

I got only List with the path directing to ./src/components/customers/List.vue and the warning:

[unplugin-vue-components] component "List"(.../src/components/users/List.vue) has naming conflicts with other components, ignored.

As soon as I disabled globs or dirs setting everything works correctly but due to more granular folder structure in my project I need a more control over the names.

To reproduce just clone reproduction, install deps and npm run dev.

Reproduction

https://github.com/simonc92/unplugin-vue-components-issue-repro

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (16) x64 AMD Ryzen 7 PRO 5875U with Radeon Graphics
    Memory: 26.47 GB / 46.80 GB
  Binaries:
    Node: 16.14.2 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 9.6.7 - C:\Program Files\nodejs\npm.CMD
    pnpm: 7.29.1 - ~\AppData\Roaming\npm\pnpm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (115.0.1901.183)
    Internet Explorer: 11.0.19041.1566

Used Package Manager

npm

Validations

lishaobos commented 1 year ago

hi, directoryAsNamespace refers to the directory inside options.dir.

if you set options.dir = src/components/customers, there's only the List.vue file inside it; there are no subdirectories you can try like this:

options.dir = src/components/mydir

simonc92 commented 1 year ago

Hi, thank for your reply.

Your suggestion works. To get more granular control over which folders will be used I had to use even more subfolders.

options.dirs = ['src/components/mydir', 'src/components/mydir2']

For me, this is not an ideal solution as now I have two extra folders I don't really need in my project but it works. It would have been nice to use the folders customers and users not only as entry point for scanning but as namespace as well.

lishaobos commented 1 year ago

hi, you also can use it: https://github.com/antfu/unplugin-vue-components/issues/420#issuecomment-1663683758

lishaobos commented 1 year ago

please waiting for 0.25.2