My previous article explains about how to create a simple Angular WebPart using SharePoint Framework Preview.
In this article, we will package and deploy the spfx-messagecenter-webpart assets to a remote CDN instead of using the local environment. We will use SharePoint Document Library as our CDN to deploy our assets but we can use our favorite CDN provider and upload the files.
To load the WebPart assets from CDN, we have to configure our CDN path in write-manifests.json file. This file can be found in the config folder.
{ “cdnBasePath“: “https://o365jv.sharepoint.com/sites/spfx/CDN/MessageCenter/” }
In this example, I have created a folder with name “MessageCenter” inside the CDN document library.
Save the file.
Switch to the console of the spfx-messagecenter-webpart project directory and run the following command to generate the assets to be uploaded in CDN
gulp bundle –ship
Generated assets can be found in spfx-messagecenter-webpart\temp\deploy folder
Run the following command to generate app file that needs to be uploaded in App Catalog site
gulp package-solution –ship
Generated spapp file can be found in spfx-messagecenter-webpart\sharepoint
Upload the spapp file to the App Catalog. Since this is a full trust client-side solution, SharePoint will show you a popup and ask you to trust the client-side solution to deploy.
Click Deploy
Drag the files from spfx-messagecenter-webpart\temp\deploy folder and upload the assets inside https://o365jv.sharepoint.com/sites/spfx/CDN/MessageCenter/
Now we can add spfx-messagecenter-webpart(you can find under custom group) to any SharePoint page. We are done.
