#Uniqueness for component selectors

9 messages · Page 1 of 1 (latest)

hot shell
#

In what context must the selector property of the Component decorator be unique? I'm guessing that it must at least be unique within a package but I'm hoping that it might just have to unique within a module.

foggy skiff
#

the selector needs to be unique with the scope of an NgModule (not sure what that means for standalone components) IIRC

#

But the real question is: Why would you want duplicate selectors to confuse future you and other developers?
The best advice is when you describe the problem you are trying to solve instead of the solution you have packed to solve it.

hot shell
#

Our team is working on a small part of a UI (a micro-frontend) as part a much larger web app. One of our focuses is on independence and minimal coupling between sub-products and teams. More than one team choosing the same selector for a component could cause duplicate HTML tags in the main web UI. I don't want duplicate selectors for anyone and that's why I'm asking this; I want to keep my selector names as short as possible while still being unique and meaningful so as long as I can freely name my selectors within a module without unnecessary prefixes or suffixes in the name

proven trail
#

Why without prefixes?

#

Without you Force coming up with special names for a component whose name is just as simple as "my-list", where my would be an app/lib specific prefix, where u enforce unique prefix names throughout all your apps and libs.

#

It also helps making it clear which component comes from your own app, which comes from a shared lib and which come from 3rd party packages.

foggy skiff
#

One liner to find all the selectors in your app and tell you if there are any duplicates (bash, but probably most shells)

find src/ -name '*.component.ts' -exec grep 'selector:' '{}' \; | sort | uniq -c
hot shell