Custom Tab For Lightning Web Components

We can use the lightning web component in the custom tab( in lightning experience and salesforce mobile app) with the winter 20 release.

If you have created a lighting web component you know that there is a configuration file that represents the metadata values for the component. To allow the lighting web component to be used in the lightning app builder we need to set “isExposed” to TRUE. Adding “lightning__Tab” to target will allow using lwc in the custom lighting component tab.

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="HelloCustomer">
<apiVersion>47.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__AppPage</target>
<target>lightning__RecordPage</target>
<target>lightning__HomePage</target>
<target>lightning__Tab</target>
</targets>
</LightningComponentBundle>

Goto -> Setup -> Quick Find -> search “tab” -> click on tab

Click on “New” button
Select your lightning web component

Arun Kumar

Arun Kumar is a Salesforce Certified Platform Developer I with over 7+ years of experience working on the Salesforce platform. He specializes in developing custom applications, integrations, and reports to help customers streamline their business processes. Arun is passionate about helping businesses leverage the power of Salesforce to achieve their goals.

Leave a Reply