We're using the aurelia-cli
. The tasks include these:
build.json
build.ts
process-css.ts
process-markup.ts
process-sass.ts
run.json
run.ts
test.json
test.ts
transpile.ts
How if at all do we do a cache-busting solution the with cli?
What we've tried already is to increment the number of the scripts
directory, so that it goes scripts1
, scripts2
, scriptsN
.
0.20.0 Support
It's my lucky day. An
aurelia-cli
release from 8 hours ago says this:Walkthru
First, install 0.20.0 and create a new app.
Or, upgrade an existing app.
Next, open
my-app/aurelia-project/aurelia.json
.Set the
build.options.rev
property to true.Set the
output
andindex
properties inside thebuild.targets
The
aurelia-cli
will look for theindex
file and replace the reference toscripts\vendor-bundle.js
like this:Finally, build the app.
Your bundles will look something like this:
Source on GitHub
cli/lib/build/bundler.js
cli/lib/build/bundler.js
My Aurelia app is hosted in an ASP.Net Core MVC page, and I have had good success using the ASP.Net Core
asp-append-version
tag helper to ensure that browsers load updated JS bundles correctly.This attribute can be added to script tags, and ASP.Net will automatically append a version # based on the script file's contents. The hash is generated when the application starts, so the application must be restarted in order for ASP.Net to detect any new changes.
The trick in getting this to work with Aurelia lies in also adding the app-bundle.js file as a script tag on the hosting page:
<body aurelia-app="main-public" class="public"> <script src="scripts/vendor-bundle.js" data-main="aurelia-bootstrapper" asp-append-version="true"></script> <script src="scripts/app-bundle.js" asp-append-version="true"></script> </body>
The output looks something like this:
<body aurelia-app="main-public" class="public"> <script src="scripts/vendor-bundle.js?v=97hNIHUQnLL3Q44m2FWNV-3NIpgqvgIDIx5sUXUcySQ" data-main="aurelia-bootstrapper"></script> <script src="scripts/app-bundle.js?v=htYOQIr-GHrpZIDiT2b32LxxPZs10cfUU4YNt9iKLro"></script> </body>
Disclaimer: I haven't inspected the vendor-bundle.js source code with regard to the loading behavior of app-bundle.js, so I don't know how robust this solution is. I have not encountered any issues with this approach, and it is working well for my scenario; however, please use with caution and test adequately before applying to production code.