require 增量更新与版本管理

使用require.js 加载JS文件时,当JS文件有更新,可以通过更改全局版本号( urlArgs : 'v=1'),告诉浏览器加载新的文件。

但该方法虽然使用方便,但美中不足的是有些不需要更新的文件也会刷新加载了,特别是当加载管理的JS文件过多时,会造成很多不必要的浪费。

所以我们希望找到一种办法可以增量更新,需要更新哪个文件就只刷新加载哪个文件.

在提出解决方案之前,先来看下我们一般是怎样刷新加载前端静态文件的,常用的方式可能是在文件地址后面添加参数,例如版本号(?v=1),这样浏览器就会认为你这个是一样新的文件,它就会刷新加载。再来看define的加载方式也是通过文件地址来管理的,例如:

define(['text!shop/tpl.item.html'], function (tpl,destTpl) {})

所以只要更改这里的文件地址,在后面加上参数便可以达到刷新加载的目的

虽然直接修改这里的文件地址可以刷新加载该文件,但前提是当前JS文件也被刷新加载了,它里面所依赖的子文件才会被刷新加载。如果你的项目加载的层次是较多的,那将会引起一连串相关文件的修改,在实践中,会发现这样的修改量并不会少

那有没有一种简易的方式呢,我所想到的方式是:动态添加版本号,将文件地址委托给一个工具类的静态方法来管理,该静态方法里可以定义某种添加版本号策略,只为有需要更新的文件添加新的版本号,其它文件不需要修改文件地址。从而达到增量更新的目的。例如:

define([Util.getDefinePath('text!shop/tpl.item.html')],function (tpl,destTpl) {})

Util.getDefinePath = function(path){
  if(path.indexOf('text!shop')!=-1){
    path = path+'?v=3';//只为需要更新的文件 添加版本号
  }
  return path;//其它文件原样输出
}

当然修改了Util类后,Util类也是需要刷新加载的,但这时只需要修改Util类的文件地址就可以了,相比之前的方式可是简单多了

原文地址:https://www.cnblogs.com/ptw-share/p/6440943.html