In Salesforce, after creating a Lightning Web Component, you might need to change the component’s name according to the business requirements.
In this Salesforce tutorial, we will learn how to rename Lightning Web Components in Salesforce.
Rename Lightning Web Component in Salesforce
To rename the Lightning Web Component, there can be two scenarios that you want to change the name of the LWC component folder and files in the database, and another requirement can be that you only want to change the label of the LWC component, what we see in the UI after deploying the component.
Rename the Lightning Web Component Folder and Files
To rename the Lightning Web Component file, follow the steps below.
- Navigate to the IDE and the LWC folder inside that. In my case, I’m using the VS code IDE.
- In the LWC folder, right-click on the Lightning Web Component you want to rename and select SFDX: Rename Component.
- Enter the new name for the lightning web component and press enter.
After this, you will see a success message at the bottom right of the screen stating that the component name has been updated.
It will also show a warning that if the LWC component is referred to in other components or elsewhere, it won’t update the component’s name.
With this, you can rename the Lightning Web Component file names by following the steps above.
Rename the Lightning Web Component Label
If you just want to update the label of the Lightning web component, you need to make changes in the HTML file.
In the HTML file of the Lightning Web Component, we use the tag <lightning-card> to define the label, the header of the component.
Inside the <lightning-card> tag, you need to change the title and, after this, deploy the code to the org to apply the changes.
This way, we can rename the Lightning Web Component label by changing the title of the lightning component.
Conclusion
In Salesforce Lightning Web Components, there are two possible scenarios for renaming the Lightning Web Component we discussed in the above steps. We learned how to change the Lightning Web Component file names and the title of the LWC component that the user will see in the UI.
You may also like to read:
- Get Record ID In Salesforce Lightning Web Component
- How to Generate PDF Using jsPDF In Lightning Web Component?
- How to Implement Conditional Rendering in Lightning Web Component?
- Searchable Lightning Combobox in Lightning Web Component
I am Bijay Kumar, the founder of SalesforceFAQs.com. Having over 10 years of experience working in salesforce technologies for clients across the world (Canada, Australia, United States, United Kingdom, New Zealand, etc.). I am a certified salesforce administrator and expert with experience in developing salesforce applications and projects. My goal is to make it easy for people to learn and use salesforce technologies by providing simple and easy-to-understand solutions. Check out the complete profile on About us.
