How to Set | Setup #LWC #Salesforce

LWC Environment Setup

Step 1:

Download and Install SFDX CLI From https://developer.salesforce.com/tools/sfdxcli

Step 2:

Download and Install MS Visual Code From https://code.visualstudio.com/

Step 3:

Open Visual Code and Install Salesforce Extension Pack

Create a Project

Step 1:

Open Visual Studio Code

Step 2:

Press COMMAND + SHIFT + P on mac OS or CTRL + SHIFT + P on Windows or Linux, then type create Project. Select SFDX: Create Project, and press Enter

Step 3:

Leave the default project name, and Press Enter.

Step 4:

Enter LWC_Project as Project as project name, and press Enter.

Step 5:

Choose a directory on your local machine where the project will be stored. Click Create Project.

Authorize your Dev Hub

Step 1:

In Visual Studio Code, Press COMMAND + SHIFT + P on mac OS or CTRL + SHIFT + P on Windows or Linux

Step 2:

Type sfdx

Step 3:

Select SFDX: Authorize a Dev Hub

Step 4:

Login using your Dev Hub org Credentials

Step 5:

Click Allow

Create a Scratch Org

Step 1:

In Visual Studio Code, Press COMMAND + SHIFT + P on macOS or CTRL + SHIFT + P on Windows or Linux.

Step 2:

Type sfdx

Step 3:

Select SFDX: Create a Default Scratch Org…

Step 4:

Press Enter to accept the default project – scratch def. json

Step 5:

Press Enter to accept the default trailhead scratch org alias

Step 6:

Press Enter to accept the default 7 days scratch org duration.

Step 7:

Be patient, creating a scratch org can take a minute.

Create a Lightning Web Component

Step 1:

Open Visual Studio Code.

Step 2:

Press Command + Shift + P on macOS or Ctrl + Shift + P on Windows or Linux, then type Create Lightning Web Component. Press Enter

Step 3:

Enter the Name sfdc_lwc_sample Press Enter

Step 4:

Press Enter to accept the default project folder

Step 5:

Be patient, creating a LWC can take a minute

Create a Lightning Web Component Using CLI Terminal

Step 1:

Open Visual Studio Code

Step 2:

Press Command + Shift + P on macOS OR Ctrl + Shift + P on Windows or Linux, then type focus terminal. Press Enter

Step 3:

Enter sfdx force: lightning: component: create -n sfdc_lwc_sample -d force-app/main/default/lwc -- type lwc, and confirm with Enter

These are the parameters you used in the command.

-n: This defines the name of the Lightning web component folder and its files.

-d: This defines the target directory where the Lightning Web Component should be created. The target directory must be named lwc

--type: This specifies that you want to create a Lightning Web Component

Daily Updates | Follow 

Subscribe Now

Support us: