Why setup the Local Development Server?
After you use it a couple times I promise you won’t ever ask this question again, lol. It makes your LWC development SO MUCH FASTER!!! I mean it might actually be Lightning Fast! (I’m sorry, but I’m not letting that joke go…).
If you’ve ever developed LWC’s directly in Salesforce you know that a handful of things can happen, your refresh times after updating your LWC’s can be ultra slow. Additionally, even after turning off persistent caching in your dev org, you will occassionally still have your component cached. That leaves you sitting there refreshing and wondering, “Wtf… how is this even possible? Do I really suck at code this much?” At least those are the thoughts I often have, lol.
With the Local Development Server, you don’t have to worry about those things ever again. It makes SF development so much easier to deal with.
What you need to install to use the Local Development Server
To setup the Local Development Server, you need to do the following things:
1) Install the Salesforce CLI
2) Install either VSCode or the IntelliJ IDE and the Salesforce plugins for them
3) Create an SFDX Project in either IDE listed above
4) Install the Local Development Server Salesforce CLI plugin by running the following command:
sfdx plugins:install @salesforce/lwc-dev-serverThere is a VERY important thing to note! In the documentation Salesforce provides for how to setup the local development server it states you need a, “Developer Hub-enabled org” to use the local dev server. THIS IS NOT TRUE! I mean, it’s in your best interest to start using scratch orgs if you can, but enabling the dev org is not a requirement for setting up the local dev server. I’m not sure if at some point it used to be required, but it isn’t anymore.
How to run the Local Development Server
After you have done the installation steps above, you can start using your local development server in one of two ways.
1) If you are in Visual Studio code, you can bring up the command palette (ctrl+shift+p) and type in the following command: SFDX: Open Local Development Server. This command will start the development server and open a browser tab for it after it has successfully started up.
2) If you are in another IDE, you can run the following CLI command from within your SFDX project:
sfdx force:lightning:lwc:startThis command will start your development server, but not open it in a browser tab automatically. You will then how to type the following address into a new tab in your browser: http://localhost:3333/
Then that’s it! You should be up and running with your Local Development Server!
How to change the port your Local Development Server runs on (Among other things)
If you need to alter some of your local development server configuration settings, you can do that!
You just need to create a file in the root of your SFDX project called localdevserver.config.json and add the relevant JSON to it. You can see an example here from Salesforce themselves, however the JSON example they have is actually incorrect, you have to make sure to wrap you names in double quotes (which is not shown in the Salesforce example. I’ll show you what I mean below with an example:
{
"port": 3333
}It’s super important to add those double quotes are the name in your JSON name value pairs. Otherwise nothing is gonna work!
Get Coding With The Force Merch!!
We now have a redbubble store setup so you can buy cool Coding With The Force merchandise! Please check it out! Every purchase goes to supporting the blog and YouTube channel.
Get Shirts Here!
Get Cups, Artwork, Coffee Cups, Bags, Masks and more here!
Check Out More Coding With The Force Stuff!
If you liked this post make sure to follow us on all our social media outlets to stay as up to date as possible with everything!
Youtube
Patreon
Github
Facebook
Twitter
Instagram
Salesforce Development Books I Recommend
Advanced Apex Programming
Salesforce Lightning Platform Enterprise Architecture
Mastering Salesforce DevOps
Good Non-SF Specific Development Books:
Clean Code
Clean Architecture