如何處理Angular 2中的文件版本

Question

在當前的angular應用1.x中，我使用了自定義模塊和文件加載器，這使我可以在文件url中添加后綴（v = xy）。 瀏覽器將基於該后綴從緩存加載文件或從服務器獲取文件。 如：

'app/user/user.services.js?v=1.2',
'app/order/order.services.js?v=1.3',

我的加載程序在每個用戶會話中動態設置版本號（1.2、1.3 ...），每個文件的版本號可以不同。

在angular 2上， 如何使用SystemJs 為我的應用程序中使用的SystemJs導入的文件定義版本號 。

建議我建議其他裝載機來解決這種情況！

Answer 1

經過一輪工作后，我找到了解決方案。 在運行system.config.js之前，我將通過請求從服務器加載版本號。 我們在開始時就有了應用的版本號。

var vQuery = '?v=1.3';

然后我可以在systemjs的config包中為每個請求添加一個前綴。 只需在defaultExtension的值上添加前綴

packages: {
  app: {
      main: './main',
      defaultExtension: 'ts' + vQuery
  }
}

之后，當SystemJS加載文件時，它將自動在文件url中添加前綴（？v = 1.3），例如：

/src/components/todoList.ts?v=1.3
/src/components/newTodo.ts?v=1.3

我們還可以通過為每個軟件包生成一個配置並將其動態添加到SystemJS中， 為每個軟件包添加不同的版本號 。 配置代碼如下：

var ngPackageNames = ['all','of your','packages'];

// list of configs for each package
var packages = [];

//method to find version for each package
getVersionOfFile: function(package){
    // find version of package and return
    return 'v=' + 'version of this package';
}

// generate config
ngPackageNames.forEach(function(package){
   // handle config for this package
   packages[pkgName] = { main: packageFile, defaultExtension: 'ts' +  getVersionOfFile(package) };
});

// at last, add config for all packages to SystemJS
var config = {
    map: map,
    packages: packages
}

System.config(config);

Answer 2

這應該在構建時完成-使用類似https://www.npmjs.com/package/gulp-rev-replace的方法

我建議使用文件哈希對文件進行版本控制-因為這只會導致實際上已更改的文件在瀏覽器中重新緩存。