Dynamically Include External Script

Hello! I have to integrate with a third-party API that requires a <script> include of their helper library. The thing is, I only need their tool on two of the routes in my app. As such, I don’t want to just add the <script> include to the app template (index.html) because then their JS library would be included on all app routes. For performance reasons, this is an undesirable approach.

What is the best way to approach this problem? Thanks in advance!

Any ideas here?

Any reason you can’t use plain JavaScript DOM manipulation to add the <script> tag when you need it? Either from a component or within a router hook?

Yeah, ultimately this is what I ended up doing. Good ol’ createElement('script') to the rescue. I just didn’t know if there was a more elegant way to do this via webpack in the app template.