6

I use r.js optimizer to combine js files based on build profile as it's suggested in documentation. Here's my build-config.js:

({
    baseUrl: ".",
    paths: {
        jquery: '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min',
    },
    name: "main",
    out: "main-built.2013-07-30.js"
})

As you can see it's based upon main.js file, here's a code of it:

requirejs.config({
    baseUrl: 'scripts',
    urlArgs: "bust=" + (new Date()).getTime(),
    paths: {
        jquery: [
            '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min',
            'lib/jquery-1.9.1.min',
        ],
    },
});

require([
    'layout',
    'cue',
], function() {

});

If I preserve urlArgs: "bust=" + (new Date()).getTime() in main.js all external files (here jquery which is loaded from CDN) look like .../jquery.js?bust=1377412213

So it's PITA to comment out this line every time I make a build. I've read through all the documentation and googled for a solution but everything in vain. Maybe I do it wrong?

rene
  • 41,474
  • 78
  • 114
  • 152
Dmitry
  • 1,484
  • 2
  • 15
  • 23

3 Answers3

2

Way late to the party on this, but here the solution I used: append the urlArgs param to the config with a subsequent call.

HTML:

<script src="js/libs/require.js"></script>
<script src="js/config.js"></script>
<script>require(['main-app']);</script>

Config File:

requirejs.config({
  paths: {...},
  shim: {...}
}); 

// Apply the cache bust only for the browser. 
if (window) {
  requirejs.config({
    urlArgs: REQUIRE_NOCACHE ? "bust="+(new Date()).getTime() : null
  });
}

The optimizer only takes the first requirejs.config declaration and it ignores the subsequent code. The second requirejs.config declaration extends rather than overrides the first, so urlArgs is still successfully applied to modules in the browser. Hope that helps.

Jes
  • 21
  • 3
  • What is *REQUIRE_NOCACHE*? – Dmitry Oct 22 '15 at 02:31
  • `REQUIRE_NOCACHE` is just a global boolean variable I declare in my dev environments. When it exists, it makes sure that the cache is busted whenever the page is refreshed. – Jes Oct 23 '15 at 15:18
  • How do you organize your dev and prod environments? – Dmitry Oct 23 '15 at 17:34
  • That's kind of a broad question... what specifically are you asking about? – Jes Oct 27 '15 at 16:30
  • Well, your example doesn't work for me because `r.js` generates result config like `window && urlArgs: bust...` which a browser then perfectly understands and thus adds *bust* to each loaded file. So it's kinda useless. What could work is the parameter **REQUIRE_NOCACHE** which should be `false` during `r.js` work and `true` in dev environment. – Dmitry Oct 27 '15 at 18:24
1

The following solution would work in your case, where you're renaming the main.js file in the r.js build:

urlArgs: require.specified('main') ? "bust="+(new Date()).getTime() : null

The above snippet will check for the module named 'main', which will match in development, but not in production, where the module is named 'main-built.2013-07-30'.

I've tested in development and production builds and it works! :-)

On the require.specified() function: With requirejs is it possible to check if a module is defined without attempting to load it?

Community
  • 1
  • 1
0

As of version 2.2.0, urlArgs now accepts functions.

It sends the moduleId and the url, so you can segment depending on the path if it should have extra args or not. See https://requirejs.org/docs/api.html#config-urlArgs

Maurício Giordano
  • 3,116
  • 4
  • 32
  • 60