+ Start a Discussion
Jordan MJordan M 

Editing Lightning Web Component

I am new to LWC and cant seem to figure out how to open the source code for LWC. Aura can be opened in the dev console but from what i understand this is not possible with LWC.

Is it possible to open a LWC source code from within the org? I have a LWC that was developed by someone else that needs editing. How can I access the source code?
Best Answer chosen by Jordan M
Soyab HussainSoyab Hussain
Hi Jordan Mathews,

Step 1. Go to workbench and login.

https://workbench.developerforce.com/login.php

Step 2.  Click on retrieve button.

User-added image
Step 3. click on "Choose File" button and upload package.xml file.

package.xml:
<?xml version="1.0" encoding="UTF-8"?>
<Package xmlns="http://soap.sforce.com/2006/04/metadata">
    <types>
        <members>*</members>
        <name>LightningComponentBundle</name>
    </types>
    <version>45.0</version>
</Package>

Step 4. click on next and retrieve metadata, it will give you all the LWC components exist in your org.

User-added image

Step 5. click Download ZIP File.

Regards,
Soyab

All Answers

Danish HodaDanish Hoda
Hey Jordan. One way is to "Right click - > Inspect" on the page.
Jordan MJordan M
Thanks for your response Danish. This allows me to view to source the source code and edit it in the browser. But I am wanting to open the code for the componenet in code editor(VS code), edit it, and then push the changes to the org.. I didnt create the orginal component so i dont have the the original files. Is this something simple that I am overlooking? 
Danish HodaDanish Hoda
Hi Jordan,
You can create a new project with Manifest in VS code. After authorizing your org, retrieve metadata from Org, you will get the whole code in force-app --> main --> default --> lwc.

The manifest file should be like : 

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<Package xmlns="http://soap.sforce.com/2006/04/metadata">
    <types>
        <members>*</members>
        <name>ApexClass</name>
    </types>
    <types>
        <members>*</members>
        <name>ApexComponent</name>
    </types>
    <types>
        <members>*</members>
        <name>ApexPage</name>
    </types>
    <types>
        <members>*</members>
        <name>ApexTestSuite</name>
    </types>
    <types>
        <members>*</members>
        <name>ApexTrigger</name>
    </types>
    <types>
        <members>*</members>
        <name>AuraDefinitionBundle</name>
    </types>
    <types>
        <members>*</members>
        <name>LightningComponentBundle</name>
    </types>
    <types>
        <members>*</members>
        <name>StaticResource</name>
    </types>
    <version>46.0</version>
</Package>
Soyab HussainSoyab Hussain
Hi Jordan Mathews,

Step 1. Go to workbench and login.

https://workbench.developerforce.com/login.php

Step 2.  Click on retrieve button.

User-added image
Step 3. click on "Choose File" button and upload package.xml file.

package.xml:
<?xml version="1.0" encoding="UTF-8"?>
<Package xmlns="http://soap.sforce.com/2006/04/metadata">
    <types>
        <members>*</members>
        <name>LightningComponentBundle</name>
    </types>
    <version>45.0</version>
</Package>

Step 4. click on next and retrieve metadata, it will give you all the LWC components exist in your org.

User-added image

Step 5. click Download ZIP File.

Regards,
Soyab
This was selected as the best answer
Jordan MJordan M
Thank you Soyab Hussain!