How to reference a javascript from within another

Develop, Build & Integrate CMS Development
1

I am trying to implement some javascript code into our cms webpage template. So I have a javascript file which I use with the require_js function:

{{ require_js(get_asset_url("../js/main.bundle.js")) }}

Somewhere in this main.bundle.js I have code that uses a worker from another file. In standalone code, this is:

var w = new Worker("./worker.js")

As is, the worker.js file is not imported when used in HS cms. In console, I get a 404 for the file. I tried:

var w = new Worker("/hs-fs/${hs_id}/theme_name/js/worker.js")var w = new Worker("https://our-domain.com/hs-fs/${hs_id}/theme_name/js/worker.js")

none the above works. Always 404.

Any advise please?
Thanks!

2

Hi, @xyboox :waving_hand: Thank you for the question. Hey, @Indra @miljkovicmisa, do you have any JavaScript wisdom you can share? Or thoughts on how @xyboox might approach this challenge?

Thank you for taking a look! — Jaycee

3

Design manager file URLs update each time you publish them so there’s no set path you can use. You’d either need to:

  • Add your file to the page so you can use it’s public URL
  • OR upload your file to the file manager and use that URL
  • OR set a global variable in a <script> in your HTML template so that you can use the get_asset_url() HubL function (because HubL isn’t usuable inside javascript files).
<script>
 window.worker = "{{ get_asset_url('relative/file/path/here/file.js') }}";
</script>