LWC Local Development



Yes!! now we can test LWC without pushing code to source org and wait for the changes to come.Salesforce has introduced another cool thing.

Now once you finish writing your code you can go to tab in chrome and check  changes working or not  without any delay.


HOW TO ENABLE??

Here are the steps how we can enable Local development in your own org.....

1) We need to install plugin on CLI as Local Development is a plugin for CLI.Using below syntax in CommantPrompt install plugin.

sfdx plugins:install @salesforce/lwc-dev-server




2)Now open your VSCode and authorize your developer org/sand box.

3)If you have installed the plugin properly you can see below command in your VSCode when you click on commands(cntrl + shift + p).

sfdx:Open Local Development Server 

4)Now click on that command and enter.This will open up new window in port http://localhost:3333/
and shows all the web components in your VSCode.




5)You can click on component which you are working/on which you are doing changes and check the changes you did.

No need to push this code to your org to check in Local Development.

No need to refresh your page http://localhost:3333/ to see the changes in Local Development.Once you save your changes in VSCode it will get reflect in your Local Development.

If you have apex class/server calls this will call your org and get the details.

I clicked on my Multi-select pick-list component which I am working.We can see the changes here.In my component I have server to get the country list.




Yeah!!! We have enabled Local Development for LWC and checked component.



Check this to know How to avoid multiple server calls in Lightning Components: Lightning Components Best Practice





Comments

Post a Comment