SharePoint framework > refer to custom .js file and call function

Regular Contributor

I started this one before:

Sorry to start a new conversation again but I cannot figure it out.


I still struggle with a reference to my custom javascript file. Now I created a very simple example, based on the "Hello World" example.

I added this to my config.json:

"externals": {
     "custom": "./src/webparts/helloWorld/myscript.js"

Added this to the "HelloWorldWebPart.ts":


import 'custom';

//call function in "myscript.js" in the "render"


This is my test function:


function testFunction() {

In my ""HelloWorldWebPart.ts"  my function is not recognised.



What is wrong in my approach?

3 Replies
best response confirmed by Mike Jansen (Regular Contributor)

Took some time but I figured it out. This is what I did:

1. No reference in the "Config.json"

2 Changed my custom script:

var CustomScript = function testFunction() {

module.exports = {
	CustomScript: CustomScript

3. in my .ts file did in the render method


const MyCustomScript: any = require('./myscript');


Now my "alert" shows up.


I do have an additional question.

What if I want to refer to another .js file from "myscript.js" ?

Just like:

<script src="blablabla"></script>
Managed to get is working by using:
"const myCustom = require('./myscript');"