Lightning Out 2.0 is configured entirely from Setup before any external developer touches the host page. You create the app, add the custom LWCs you want to expose, optionally declare the properties the host may pass, then copy the generated code block into the external app.
- Open the App Manager and create the app
In Setup, go to the App Manager and click New Lightning Out 2.0 App. Give it a name. This record is the boundary that decides which components are allowed to leave Salesforce.
- Add your custom components
On the Edit page, open the App Components tab. In the Component Name field, enter each custom LWC, separating namespace from name with a forward slash or hyphen (for example c/myComponent), then click Add Component.
- Declare any properties the host can pass
Define the custom property values your external page is allowed to hand the components. Only the attributes the LWC already supports can be set, in HTML, JavaScript, or JSON, so plan the public surface of each component.
- Copy the generated code block
Take the Lightning Out 2.0 code block the App Manager produces. It includes the script element and the markup that loads the app and renders your components. Paste it directly into the external app's HTML.
- Wire the lifecycle events and test
On the host page, listen for lo.application.ready and lo.component.ready to confirm the session and render, and surface lo.application.error and lo.component.error during development so failures are visible.
The custom LWC to expose, with namespace and name separated by a forward slash or hyphen. Standard components must be wrapped in a custom component first.
Attribute values the external host is permitted to pass to the embedded components. Restrict these to attributes the LWC genuinely supports.
The script element and markup output by the App Manager. Load this from the host page directly, never from inside another LWC, because Lightning Web Security blocks that.
- Only custom LWCs are supported. Wrap any standard lightning-namespace component in your own LWC before adding it, or it may not style or behave as documented.
- The app serves authenticated Salesforce users only. Unauthenticated, fully public access is not yet available, so this is not a drop-in for an anonymous marketing page.
- Third-party cookies in the browser and cross-domain session cookies for the org must both be enabled, or the frontdoor session handshake fails and nothing renders.
- The lightning/navigation service is not supported, so embedded components cannot drive page navigation the way they would inside Lightning Experience.