Are subfolders still discouraged if name conflicts aren't possible?

[dezhi-jacky-fu]

The style guide says not to put components into subfolders, and one reason given is:

Name conflicts (e.g. multiple ButtonDelete.vue components) make it more difficult to quickly navigate to a specific component in a code editor.

But if the tool, in my case it is nuxt, builds the component's name from its full folder path, not just the filename, then two files both called Table.vue in different folders don't actually clash. They end up as different names. So that specific reason wouldn't apply.

Concretely, we have several unrelated areas that each define their own Table, Bar, Map, Timeline, etc., so a flat folder ends up full of files like:

ReportSalesTable.vue
ReportInventoryTable.vue
ReportMarketingTable.vue
ReportSalesMap.vue
ReportOperationsMap.vue

Same suffix, different prefix, repeated across dozens of files (100+). With path-derived naming, grouping by area would let each just be Table.vue / Map.vue inside its own folder, without the two files colliding.

Are there other downsides to using folders, besides the three the guide lists (slower to navigate, name conflicts, harder refactoring)?
If the name-conflict reason doesn't apply here, does that meaningfully weaken the advice against folders, or do the other two reasons still hold up on their own?

I posted a framework-specific version here: nuxt/nuxt#36362

[Kxrma47]

The advice is not an absolute ban: the guide itself says to consider directories for very large applications (its example threshold is 100+ components), which matches your case.

Path-derived names solve the runtime registration collision, but they do not completely solve the editor problem: several tabs/search results can still be named Table.vue. The remaining trade-offs are directory navigation and path-based imports during refactors.

For a 100+ component Nuxt app, domain folders are reasonable. A practical compromise is:

components/report/sales/ReportSalesTable.vue
components/report/inventory/ReportInventoryTable.vue

Nuxt removes duplicate name segments, so you retain <ReportSalesTable /> while keeping both folder organization and descriptive filenames. If your editor displays full paths clearly, shorter leaf names are also a defensible team convention.

Reference: https://vuejs.org/style-guide/rules-strongly-recommended.html#order-of-words-in-component-names

[dezhi-jacky-fu]

Thank you for your thoughts on this, I will think about your suggestion, this looks like a promising alternative to me.