RequireJS seems to do something internally that caches required javascript files. If I make a change to one of the required files, I have to rename the file in order for the changes to be applied.
The common trick of appending a version number as a querystring param to the end of the filename does not work with requirejs <script src="jsfile.js?v2"></script>
What I am looking for is a way to prevent this internal cacheing of RequireJS required scripts without having to rename my script files every time they are updated.
Cross-Platform Solution:
I am now using urlArgs: "bust=" + (new Date()).getTime()
for automatic cache-busting during development and urlArgs: "bust=v2"
for production where I increment the hard-coded version num after rolling out an updated required script.
Note:
@Dustin Getz mentioned in a recent answer that Chrome Developer Tools will drop breakpoints during debugging when Javascript files are continuously refreshed like this. One workaround is to write debugger;
in code to trigger a breakpoint in most Javascript debuggers.
Server-Specific Solutions:
For specific solutions that may work better for your server environment such as Node or Apache, see some of the answers below.
Generally you only use RequireJS in its loading form during development. Once the site is done and ready for deployment, you minify the code. The advantage here is RequireJS knows exactly what your dependencies are, and thus can easily minify the code in the correct order.
As per RequireJS API documentation, shim lets you. Configure the dependencies, exports, and custom initialization for older, traditional "browser globals" scripts that do not use define() to declare the dependencies and set a module value.
Advertisements. RequireJS can be initialized by passing the main configuration in the HTML template through the data-main attribute. It is used by RequireJS to know which module to load in your application. For instance − <script data-main = "scripts/main" src = "scripts/require.js"></script>
To include the Require. js file, you need to add the script tag in the html file. Within the script tag, add the data-main attribute to load the module. This can be taken as the main entry point to your application.
RequireJS can be configured to append a value to each of the script urls for cache busting.
From the RequireJS documentation (http://requirejs.org/docs/api.html#config):
urlArgs: Extra query string arguments appended to URLs that RequireJS uses to fetch resources. Most useful to cache bust when the browser or server is not configured correctly.
Example, appending "v2" to all scripts:
require.config({ urlArgs: "bust=v2" });
For development purposes, you can force RequireJS to bypass the cache by appending a timestamp:
require.config({ urlArgs: "bust=" + (new Date()).getTime() });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With