问题
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
.
回答1:
0.20.0 Support
It's my lucky day. An aurelia-cli release from 8 hours ago says this:
Features: Support bundle revision numbers
Walkthru
First, install 0.20.0 and create a new app.
npm install aurelia-cli@">=0.20.0" -g
au new my-app
Or, upgrade an existing app.
npm install aurelia-cli@">=0.20.0" --save-dev
Next, open my-app/aurelia-project/aurelia.json
.
Set the build.options.rev
property to true.
"options": {
"minify": "stage & prod",
"sourcemaps": "dev & stage",
"rev": true
},
Set the output
and index
properties inside the build.targets
"targets": [
{
"id": "web",
"displayName": "Web",
"output": "scripts",
"index": "index.html"
}
],
The aurelia-cli
will look for the index
file and replace the reference to scripts\vendor-bundle.js
like this:
<script src="scripts\vendor-bundle.js" data-main="aurelia-bootstrapper">
<script src="scripts\vendor-bundle-947c308e28.js" data-main="aurelia-bootstrapper">
Finally, build the app.
au build --env prod
Your bundles will look something like this:
app-bundle-e0c4d46f7d.js
vendor-bundle-dba9184d78.js
Source on GitHub
cli/lib/build/bundler.js
let defaultBuildOptions = {
minify: "stage & prod",
sourcemaps: "dev & stage",
rev: false
};
cli/lib/build/bundler.js
if (buildOptions.rev) {
//Generate a unique hash based off of the bundle contents
this.hash = generateHash(concat.content);
bundleFileName = generateHashedPath(this.config.name, this.hash);
}
回答2:
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.
来源:https://stackoverflow.com/questions/39651190/client-side-cache-busting-using-the-cli