Search code examples
wakanda

Wakanda: How to link to a clientside js file without duplicating it?

I have some code that I want to reuse across many clientside pages. Wakanda allows you to attach clientside scripts to a page, but it makes a copy of them. This is an issue when the scripts need updating as I have to update every single one. I know one workaround is to create an RPC module which allows for many pages to link to one serverside script, but this does not solve the issue of wanting to do the logic on the client side. Any suggestions?

Solution

  • I assume that you are using Wakanda prototyper to generate a webpage. The 'copy' behavior is due to the fact that the server needs to have the added javascript file into the web folder to provide it into the runtime environment. Thus it takes it (from even outside the web folder) and copy it inside a known location.

    However in order to provide a single file (js or css), without duplicating it, I suggest you to:

    1. If opened, close the prototyper.
    2. Expand the page on the file explorer on the left. If you are working with the default solution it will be PROJECT/web/prototype/index and look for index.html.
    3. Open the .html file. In the default solution case index.html.

    Now you will have the html source code of the page opened with the code editor. You can now provide as many javascript files as you want simply adding them as html tags.

    example: <script type="text/javascript" src="/my/path/to/file.js"></script>

    NOTE: The absolute path / points to the web folder thus the file you are adding should be copied inside that folder and then you can use the same <script> tag for any page you want.

    The same logic can be found outside the prototyper in the production app folder provided in the base solution.