unplugin-vue-components icon indicating copy to clipboard operation
unplugin-vue-components copied to clipboard

directoryAsNamespace ignored when using multiple globs or dirs

Open simonc92 opened this issue 2 years ago • 4 comments

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

  • [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.

simonc92 avatar Aug 14 '23 14:08 simonc92

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

  • src
    • components
      • mydir
        • customers
        • users

lishaobos avatar Aug 17 '23 03:08 lishaobos

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']

  • src
    • components
      • mydir
        • customers
      • mydir2
        • users

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.

simonc92 avatar Aug 17 '23 05:08 simonc92

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

lishaobos avatar Aug 24 '23 07:08 lishaobos

please waiting for 0.25.2

lishaobos avatar Aug 24 '23 08:08 lishaobos