Lightning Web Components (LWC) and Aura Components are both frameworks for building reusable components in the Salesforce platform. LWC is a modern framework built on web standards, while Aura Components are based on the older Aura framework.
One question that often comes up is whether LWC and Aura Components can be used together in the same application. The answer is yes, they can be used together, but there are some important considerations to keep in mind.
LWC and Aura Components are not directly interoperable. You cannot use an Aura Component inside an LWC or vice versa. You can use either framework to build components that can be used in the other framework. This is because the DOM subtree of a Lightning Web Component must be composed entirely of Lightning Web Components.
To use an Aura Component in an LWC, you can use the Lightning Element tag. This allows you to wrap an Aura Component in an LWC and use it as if it were an LWC component.
To use an LWC in an Aura Component, you can use the lwc:dom=”manual” directive. This allows you to manually render an LWC component inside an Aura Component.
It’s also worth noting that you can use either framework to build custom elements that can be used in any other framework or application that supports custom elements.
Wrapping It Up
While LWC and Aura Components are not directly interoperable, they can be used together by wrapping one in the other or by building custom elements. It’s essential to consider the trade-offs between LWC and Aura Components, as LWC is generally regarded as modern and more performant.
We should always choose to use LWC over Aura. There are cases where this rule has exceptions, maybe something isn’t supported, etc.
Also published on Medium.