Include JavaScript file so it load automatically in SharePoint Framework

Question

I am beginner and trying to include JS file in my SharePoint Framework Webpart. I learned how to call different functions of the JS file. I know you can include the file using

const myScript = require('./JS/my-script.js');

and execute the functions but this is not my requirement.

I want to load the whole file like it was possible through script editor in old SharePoint.

Is there any way or work around with which I can include the whole file and get the equivalent functionality of script editor.

Any idea or suggestions will be helpful

Answer 1

Microsoft didn't make modern versions of the ScriptEditor or ContentEditor web parts because they felt that users injecting script directly into pages had too great a potential to destabilize the page or unintentionally cause data loss.

Their solution to this problem was the SharePoint Framework. Using the SharePoint Framework developers can still inject JavaScript into pages, however that script needs to be contained in a package and deployed to an App Catalog first. The concept is that administrators, who have control over the access to the App Catalog, will have the opportunity to review any code before it gets deployed.

With all of that said, the SharePoint developer community felt that despite Microsoft's concerns there was value in having modern versions of the ScriptEditor or ContentEditor web parts so they created their own. Please see the following blog posts for more information.

Perhaps the only SharePoint Framework web part you will ever need (ScriptEditor) https://www.techmikael.com/2017/03/perhaps-only-sharepoint-framework-web.html

Perhaps The Only OTHER SharePoint Framework Web Part You Will Ever Need (ContentEditor) https://info.paitgroup.com/blog/perhaps-the-only-other-sharepoint-framework-web-part-you-will-ever-need

Answer 2

You could make an SPFx Application Customizer and inject JavaScript into the head, pointing to a known siteassets location...

http://1jj.uk/cobspfxappcust

...although this obviates some of the inherent security of bundling the JavaScript in to your SPFx package itself.

Joel @jfdiconsulting