How do I include JS Javascript src links in SPA pages

I have one SPA page where I have a canvas for users to draw and manipulate graphics. This is only required on one page but it does require quite a few links to locally stored javascript files.

So naturally I thought I could simply add this to the SPA page

<script src="fabric/dist/canvas-toBlob.js"></script>

It doesn’t load.

And yet if I do the same thing with CSS

<link rel="stylesheet" href="css/prism.css">

This does load.

How can I have links to Javascript files on the SPA?

I could add them to the parent page, but then they would load each and every time. Or is that the way it should be?

This canvas area will not be used very often, but it is an important area.

The link should be placed in the parent page. The parent page is loaded just once, therefore there are no reloads unless manually done so by the user.

2 Likes

Thanks for confirming that @ben. I know the parent is only loaded once which is a great benefit but my mind still likes small neat packages kept together.

For the sake of neatness, and managing files, would it be good practice to put the files in question into a separate php file and include that file in the parent? That way I know all the files for this particular function are ‘contained’ together? Or am I being silly? Or is there another way?

Hi Neil,

I also love to keep things neat and tidy. Perhaps you could do something like what I have done for iOS

1 Like

Thanks for that Ben, always good to see how others solve little challenges :slight_smile:

1 Like