There are various options to package and deploy a SharePoint Framework solution and as part of packaging and deployment process, the developers have to identify a best approach for their team. Sometimes it becomes a nightmare to plan the right approach for your solution, if you haven’t weighed the options properly.
Working at multiple implementations of SPFx solution for sometime now, I have been able to get an idea of various options and approach for them. Hence in this blog, we will at these options and look at merits and limitations for each.
At a high level, below are the main components that are deployed as part of SPFx package deployment:
- The minified js file for all code
- The webpart manifest file
- Webpart compiled file
- The package (.pckg) file with all package information
Deployment Options
Please check this blog for an overview of the steps for building and packaging a SPFx solution. The packaged solution (.sppkg) file can then be deployed to a App catalog site. The assets of the package (point 1-3 of above) could be deployed by any of the four below options. We will look at the merits and limitations for each.
1. Deploy to Azure CDN or Office 365 CDN
The assets could be deployed to an Azure CDN. The deployment script is already a part of SPFx solution and could be done from within the solution. More detailed steps for setting this up are here.
Note: Please remember to enable CORS on the storage account before deployment of the package.
If CORS is not enabled before CDN profile is used, you might have delete and recreate the Storage account.
Merits:
- Easy deployment using gulp
- Faster access to assets and web part resources because of CDN hosting
- Add geographical restrictions (if needed)
Limitations:
- Dependency on Azure Subscription
- Proper set up steps required for setting up Azure CDN. In some cases if the CDN if not set properly, then the deployment has to be done again.
- Since the assets are deployed to a CDN endpoint, so if assets need restricted access then this mayn’t be recommended
2. Deploy to Office 365 Public CDN
For this option, you will need to enable and set up Office 365 CDN in your tenancy before deployment. For more details of setting this up, check the link here.
Merits:
- Faster access to assets and web part resources because of CDN hosting
- No Azure subscription requirement
- Content is accessible from SharePoint Interface
Limitations:
- Manual copy of assets files to CDN enabled SharePoint library
- Office 365 CDN is a tenant setting and has to be enabled for the whole tenancy
- Since the assets are deployed to a CDN endpoint, so if assets needs restricted access then this mayn’t be recommended
- Accidental deletion could cause issues
3. Deploy to SharePoint document library
This is also an option to copy for the compiled assets to be copied to a SharePoint document library anywhere in the tenancy. Setting this up is quite simple, first set the setting “includeClientSideAssets”: false in package-solution.json file and then set the CDN details in write-manifests.json file.
Merits:
- No need of additional Azure hosting or enabling Office 365 CDN
- Access to Assets files from SharePoint interface
Limitations:
- Manual Copy of assets file to SharePoint library
- Accidental deletion could cause issues
4. Deploy to ClientAssets in App Catalog
From SPFx version 1.4, it is possible to include assets as part of the package file and deploy it to the hidden ClientAssets library residing in App Catalog. It is set in the package-solution.json file “includeClientSideAssets”: true.
Merits:
- No extra steps needed to package and deploy assets
Limitations:
- Increases the payload of the package file
- Risk for Tenant admins to deploy script files to the Tenant App Catalog.
Conclusion
In this blog, we saw the various options for SPFx deployment, and merits and limitations of each approach.
Happy Coding !!!