Filepond in a Lightning Web Component for Salesforce upload – Part 1
This short series of posts will be a how-to on setting up an enhanced upload component for Salesforce. This could be used both on a Salesforce record page or indeed in a community.
The main steps will be:
- Set up a scratch org and do the initial load of the filepond library
- Check that the library is loading and starting to work
- Set up the component
Let’s set up a new scratch org to get going, so the code below will create a project in a new filepond directory, we can then open Visual Studio Code and then create a Salesforce scratch org called FilePondScratch :
sfdx force:project:create –-projectname Filepond cd Filepond code . sfdx force:org:create --setd
efaultusername --setalias FilePondScratch --definitionfile config/project-scratch-def.json -d 5 -s
You can now open the blank scratch org from within the bottom toolbar of Visual Studio code or by sfdx force:org:open
The files we need are located at:
Download these 5 files and create a file called filepond.zip
From the Salesforce setup menu, search for ‘Static Resources’ and then upload your zipped file using the name filepond. Use Public cache control if you want to have the resources available in things like community sites.
From within Visual Studio code do a sfdx force:source:pull to pull the static resource back to your local development (of course you could push from the local development to the org, but this method is a bit easier).
Check your visual studio environment to make sure that you have the files you need and uploaded:
In the next post we will get a LWC up and running and start using these resources we have uploaded.