URL cache-busting parameters with RequireJS?

Question

I'm using RequireJS (the jQuery version) and I want to append GET parameters to my scripts to prevent unwanted caching.

I'm using the urlArgs parameter, as suggested in the docs. This is my app-build.js file:

({
  appDir: "../",
  baseUrl: "scripts/",
  urlArgs: "cache=v2",
  ...

Then I build the project as follows:

$ node ../../r.js -o app.build.js

The output in app-build directory now contains both require-jquery.js, which is the same file as previously, and require-jquery.js?cache=v2, which is blank.

The index.html file doesn't seem to have any references to cache=v2. And when I load the page in a browser, I don't see any cache=v2 parameters appended to any of the scripts.

Am I doing something wrong?

Answer 1

The docs on urlArgs:

“During development it can be useful to use this, however be sure to remove it before deploying your code”

and this issue from Github, James Burke: “do not try to use urlArgs during build”

Answer 2

The urlArgs parameter is more of a runtime configuration (i.e., only understood by RequireJS, not the r.js optimizer), seemingly due to its author's stated belief that it is only suited to development (and "bad" dev servers that don't send proper headers). So you'd either need to configure it in your require.config call (in a .js file loaded by require.js, typically main.js or config.js):

require.config({
    // other config, like paths and shim

    urlArgs: "cache=v2"
});

Or, per this other SO answer, you'd define it in directly in a <script> block before loading require.js.