eframe_template icon indicating copy to clipboard operation
eframe_template copied to clipboard

clarification on how to deactivate the cache in development

Open Tudyx opened this issue 2 years ago • 5 comments

In the ReadMe you have mentioned

assets/sw.js script will try to cache our app, and loads the cached version when it cannot connect to server allowing your app to work offline (like PWA). appending #dev to index.html will skip this caching, allowing us to load the latest builds during development.

Please could you indicate where to add the #dev. Should I add it to the filesToCache variable inside the sw.js, should i rename the index.html at the root folder or should I append it to the content of index.html at the root folder.

Sorry if my question seems dumb

Tudyx avatar Dec 06 '22 13:12 Tudyx

I finally found my way around this. It works by adding "#dev" to the filename of "index.html" at the root folder. In order to Trunk to still find the template, we must also update Trunk.toml:

target = "index.html#dev"

If you navigator has already cached your app, you must delete the cache manually.

Do you think it’s worth adding this to the README ?

Tudyx avatar Dec 15 '22 15:12 Tudyx

you should add #dev to the url. so, for example, http://localhost:8080/index.html#dev.

It might be worth specifying this in the README. Although, i would prefer if we don't have any caching at all or if it was actively opt-in.

coderedart avatar Feb 02 '23 03:02 coderedart

The above method is useful and works for me. Here is the summary. Q: How to disable cache? Step 0: Clear cache in your browser Step 1: Rename the eframe_template/index.html to eframe_template/index.html#dev Step 2: Adding target = "index.html#dev" to eframe_template/Trunk.toml Step 3: Run trunk serve and access http://localhost:8080/index.html#dev then you will always see the updated version of your app.

Sugar-Coder avatar Feb 13 '23 09:02 Sugar-Coder

If you want to disable the caching forever, the best method is to just delete (or comment out)

    <!--Register Service Worker. this will cache the wasm / js scripts for offline use (for PWA functionality). -->
    <!-- Force refresh (Ctrl + F5) to load the latest files instead of cached files  -->
    <script>
        // We disable caching during development so that we always view the latest version.
        if ('serviceWorker' in navigator && window.location.hash !== "#dev") {
            window.addEventListener('load', function () {
                navigator.serviceWorker.register('sw.js');
            });
        }
    </script>

from the index.html file.

coderedart avatar Feb 13 '23 11:02 coderedart