Component Namespaces

Every component is part of a namespace.

To reference your own components, always code with the default namespace, c. Use c regardless of where the code is running: in an org with or without a namespace, in a managed or unmanaged package.

Within an HTML template, to reference a component in the lightning namespace, use <lightning-component-name>. A hyphen character (-) separates the namespace from the component name.

This component references lightning-card, which is a base Lightning component in the lightning namespace. It also references c-contact-tile, which is a custom component in the same project.

Within a JavaScript class, to reference a module (also called a service component or a library), add namespace/module. The forward slash character (/) separates the namespace from the module name.

In Winter ’23, new orgs have Lightning Web Security for Lightning web components enabled by default.

When your components run in an org that has Lightning Web Security enabled, the components can import modules from other namespaces. For more information, see How Lightning Web Security Compares to Lightning Locker.

Consider these guidelines when you're working with a namespace.

  • A custom Lightning web component can't access a Lightning web component or module in a custom namespace when running in an org that’s using Lightning Locker instead of Lightning Web Security.
  • It can access Lightning web components and modules only in the c and lightning namespaces when running in an org that’s using Lightning Locker instead of Lightning Web Security.
  • A custom Lightning web component and a custom Aura component in the same namespace can't have the same name, whether the components are running in an org with Lightning Locker or Lightning Web Security enabled.