3

We need to include a third-party solution in our SPFX app which itself is rendered as in iFrame within the web part. We have this working locally in the workbench and it works when deployed, but only if we manually change the location of the iFrame to the correct URL. Anyhow, we need a relative path and therefore would like to include the third-party components files (html, css, js) in the solution package so that they can be hosted from the O365 CDN.

My question: Is it possible? and if so how can we configure the SPFX toolchain to simply include a collection of files (and folder structure) in the solution package?

1

According to SharePoint PnP Webcast – Including assets in SharePoint Framework solution packages,

Starting from version 1.4 JavaScript assets and other static solution files are automatically included in the sppkg file, which is deployed to app catalog. These assets are automatically hosted from the app catalog URL address.

If Office 365 Public CDN is enabled in the tenant, it’s automatically used when the SharePoint Framework solution files are being requested. If Office 365 CDN is not however enabled, assets are served directly from the app catalog site collection.

Starting from version 1.4, solution assets are automatically included in the sppkg file. This behavior can, however, be controlled from the package-solution.json file with includeClientSideAssets property.

Check video tutorial given in above URL.

Also you can add custom JavaScript files, CSS files and images in your SPFx webpart using SPComponentLoader module and require.

For detailed information, check below article:

How to add external libraries and assets in SharePoint client-side web part.

| improve this answer | |
  • Thanks Ganesh, I have already seen and reviewed those resources and they do not cover my question unfortunately. The PnP vid is discussing the change to enable the generated assets to be deployed with the solution package and auto host on O365 CDN... neither of the resources outline how to simply include a collection of static resources (holder structure, css, js, HTMl files) within the solution package. Put super simply, I just want to include a collection of files and folders in the solution package which will be deployed as-is to the O365 CDN – Jay Feb 4 at 17:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.