@salesforce/lightning-out

Lightning Out 2.0 for Salesforce - embed Lightning components in any web application.

Installation

npm install @salesforce/lightning-out

Module Formats

This package is distributed in multiple formats:

• ES Modules: import { initialize } from '@salesforce/lightning-out';
• CommonJS: const { initialize } = require('@salesforce/lightning-out');
• UMD: <script src="https://unpkg.com/@salesforce/lightning-out/dist/index.umd.min.js"></script>

Tree Shaking Support

This package supports tree shaking, allowing bundlers to eliminate unused code for smaller bundle sizes.

Usage

Basic Usage

import { LOApplication, LOComponent } from '@salesforce/lightning-out';

// Create and configure a Lightning Out application
const app = new LOApplication();
app.setAttribute('endpoint', 'https://your-salesforce-community-url');
app.setAttribute('namespace', 'your-namespace');
document.body.appendChild(app);

// Create a Lightning component with attributes
const component = new LOComponent();
component.setAttribute('name', 'namespace:componentName');
component.setAttribute('attribute1', 'value1');
component.setAttribute('attribute2', 'value2');
app.appendChild(component);

Using Custom Elements

// Create Lightning Out application using custom elements
const app = document.createElement('lightning-out-application');
app.setAttribute('endpoint', 'https://your-salesforce-community-url');
app.setAttribute('namespace', 'your-namespace');

// Add to a specific target element
document.getElementById('target-element-id').appendChild(app);

// Create a component inside the application
const component = document.createElement('lightning-out-component');
component.setAttribute('name', 'namespace:componentName');
component.setAttribute('attribute1', 'value1');
app.appendChild(component);

API Documentation

See the full documentation at https://developer.salesforce.com/docs/lightning-out