Skip to content Skip to sidebar Skip to footer

How To Reload A File Via Require.js Triggered From The Browsers Js Console

Having a text file (underscore templates) loaded by require.js on initial app start: define(['text!templates/template.html'], function(Template){ ... }; When i am now making chang

Solution 1:

RequireJS is not designed for reloading modules, generally speaking.

However, if you design your application carefully you can get RequireJS to reload some modules. Here's an example:

<body><pid="contents">Nothing loaded.</p><buttonid="reload">Reload</button><script>require.config({
        baseUrl: "./js",
        paths: {
            jquery: '//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min',
        }
    });
    require(["jquery"], function ($) {
        var $contents = $("#contents");
        functionreload() {
            require.undef("text!../file.html");
            require(["text!../file.html"], function (file) {
                $contents.empty();
                $contents.append(file);
            });
        }
        $("#reload").click(reload);
    });
  </script></body>

The key is to call require.undef to undefine the module before reloading it.

I've got a repo illustrating the whole thing. If you edit the file.html file and hit the "Reload" button, the text of the paragraph will be replaced with the contents of the file. To get a function you can invoke form the console just assign it to a field of window (e.g. window.reload).

The button should really be called Load/Reload (because it does the initial loading and the reloading) but I'm not going to fix it.

Post a Comment for "How To Reload A File Via Require.js Triggered From The Browsers Js Console"