Lightning Aura Components Developer Guide

Introducing Aura Components
Quick Start
Creating Components
Component Names
Create Aura Components in the Developer Console
Lightning Bundle Configurations Available in the Developer Console
Create Aura Components Using Salesforce CLI
Component Markup
Component Namespace
Component Bundles
Component IDs
HTML in Components
CSS in Components
Component Attributes
Using Expressions
Component Composition
Component Body
Component Facets
Controlling Access
Using Object-Oriented Development
Best Practices for Conditional Markup
Aura Component Versioning for Managed Packages
Base Components with Minimum API Version Requirements
Validations for Aura Component Code
Using Labels
Localization
Working with Lightning Base Components
Supporting Accessibility
Writing Documentation for the Component Library
Using Components
Communicating with Events
Communicating Across the DOM with Lightning Message Service
Creating Apps
Styling Apps
Developing Secure Code
Using JavaScript
Working with Salesforce Data
Testing Components
Debugging
Performance
Reference
PDF

Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Lightning Bundle Configurations Available in the Developer Console

Configurations make it easier to create a component or application for a specific purpose, like a Lightning page or Experience Builder site page, or a quick action or navigation item in Lightning Experience or Salesforce mobile app. The New Lightning Bundle panel in the Developer Console offers a choice of component configurations when you create an Aura component or application bundle.

Configurations add the interfaces required to support using the component in the desired context. For example, when you choose the Lightning Tab configuration, your new component includes implements="force:appHostable" in the <aura:component> tag.

Using configurations is optional. You can use them in any combination, including all or none.

The following configurations are available in the New Lightning Bundle panel.
Configuration Markup Description
Aura component bundle
Lightning Tab implements="force:appHostable" Creates a component for use as a navigation element in Lightning Experience or Salesforce mobile apps.
Lightning Page implements="flexipage:availableForAllPageTypes" and access="global" Creates a component for use in Lightning pages or the Lightning App Builder.
Lightning Record Page implements="flexipage:availableForRecordHome, force:hasRecordId" and access="global" Creates a component for use on a record home page in Lightning Experience.
Experience Builder Site Page (previously Lightning Communities Page) implements="forceCommunity:availableForAllPageTypes" and access="global" Creates a component that’s available for drag and drop in the Experience Builder.
Lightning Quick Action implements="force:lightningQuickAction" Creates a component that can be used with a Lightning quick action.
Lightning application bundle
Lightning Out Dependency App extends="ltng:outApp" Creates an empty Lightning Out dependency app.

For details of the markup added by each configuration, see the respective documentation for those features.

Note