Technique actuellement recommandée pour les applications Aurelia (basées sur SystemJS) qui bloquent le cache

Question

J'ai trouvé des problèmes de github et des articles sur les applications Aurelia et SystemJS. Cependant, je n'ai pas eu 100% de succès avec ceux-ci. Une technique de plugin système avait des effets secondaires de virement de bord sur un url param deux fois. En outre, les paramètres url ne semblent pas garantir que les ressources mises en cache ne sont pas utilisées sur tous les navigateurs.

La meilleure solution 100% solide de mon point de vue serait de déployer l'application à un chemin différent. Par exemple, virer de bord la version et le temps de construction dans l'url chemin, https://my.domain.com/v1.0.0b20161011_120001/index.html, https://my.domain.com/v1.0.0b20161011_120122/index.html

Quelle est la technique recommandée actuelle, plug-in ou tout autre processus pour le cache-busting des applications Aurelia?

Answer 1

Si vous voulez forcer votre application Aurelia à constamment rafraîchi après avoir modifié, vous pouvez jeter un oeil sur le fil suivant:

https://github.com/aurelia/framework/issues/94

Aaike a commenté le 8 mai 2015:

changer votre index.html pour ajouter l'extension à droite avant d'importer l'aurelia-bootstrapper

<script> 
     var systemLocate = System.locate; 
     System.locate = function(load) { 
     var System = this; 
     return Promise.resolve(systemLocate.call(this, load)).then(function(address) { 
      if(address.lastIndexOf("html.js") > -1) return address; 
      if(address.lastIndexOf("css.js") > -1) return address; 
      return address + System.cacheBust; 
     }); 
     }; 
     System.cacheBust = '?bust=' + Date.now(); 

     System.import('aurelia-bootstrapper'); 
</script> 

Vous pouvez également créer une tâche gourmande qui ajoute un numéro de version à vos fichiers groupés, comme suggéré par shaunluttin dans le fil https://github.com/aurelia/framework/issues/94.

var gulp = require('gulp'); 
var replace = require('gulp-replace'); 
var fs = require("fs"); 

var buildNumberFile = 'build/build-number.txt'; 

var filesToChange = [ 
    'build/bundles.js', 
    'build/paths.js', 
    'config.js', 
    'package.json' 
]; 

gulp.task('cache-bust', function() { 

    // get the current build number 
    var contents = fs.readFileSync(buildNumberFile, 'utf8'); 
    version = parseInt(contents); 

    // bump the current build number 
    version = version + 1; 
    fs.writeFile(buildNumberFile, version); 

    // 
    // matches "dist 
    // matches 'dist 
    // matches "dist1 
    // matches 'dist12 
    // 
    var outputDirectoryRegex = /([\"|\']dist)([0-9]*)/g; 

    // replace the build number in appropriate files 
    gulp.src(filesToChange, { base: './' }) 
     .pipe(replace(outputDirectoryRegex, '$1' + version)) 
     .pipe(gulp.dest('.')); 
}); 

Answer 2

Option 1 ne fonctionne pas entièrement, mais Option 2 fonctionne pour moi. Je devais changer le outputDirectoryRegEx à

var outputDirectoryRegex = /([\"|\'|\\|\/]dist)([0-9]*)/g; 

depuis que le mien est à l'intérieur wwwroot/