如何将版本号添加到js和css文件

时间:2016-02-22 19:57:16

标签: javascript gulp bower

我想将所有的bower组件插入到我的索引页面中,并带有适当的版本后缀。按版本后缀,我的意思是version文件中每个组件的特定bower.json属性的版本号。

举个例子,

我的应用程序bower.json依赖项中有jquery。

{
    "dependencies": {
        "jquery": "^2.2.0",
    }
}

jquery组件有自己的.bower.json,json有version属性。

{
  "name": "jquery",
  "main": "dist/jquery.js",
  "license": "MIT",
  "version": "2.2.0"
  // ETC...
}

我想要的是从组件的.bower.json文件中提取此版本号,并创建一个这样的脚本标记

<script src="/bower_components/jquery/dist/jquery.js?version=2.2.0"></script>

我正在使用gulp wiredep任务自动在index.html中插入我的组件。我可以通过使用fileTypes属性覆盖wiredep的options属性,为脚本标记的src属性添加自定义后缀。

fileTypes: {
    html: {
        replace: {
            js: '<script src="{{filePath}}?v=0.1"></script>'
        }
    }
}

但是我无法弄清楚如何获取每个特定组件的版本号以及如何在wiredep将它们插入页面时单独覆盖它们。

我的方法是否正确?然后,我该怎么办? 或者有更好的方法来实现这一目标......

P.S。 - 此要求与缓存清除有关。但根本不是。我正在使用gulp-rev来缓存我的自定义应用程序js和css文件。但是bower组件不应该在每个构建中被缓存破坏。我想用他们的版本号引用它们,并且只在我更新它们时使用缓存清除,并使用新的版本后缀缓存。

1 个答案:

答案 0 :(得分:2)

按要求 -

有几种缓存清除机制使用校验和或数据哈希实现缓存清除,可能比更新版本号更适合您的需求:

  • 吞缓存-胸围
  • 吞-cachebust
  • 吞-胸围

是我发现只是在进行谷歌搜索的一些

我最近使用的那个是第一个(gulp-cache-bust)