gulp教程之gulp-rev-append

Ooo_My_God发表于 分类:构建工具 阅读(7120) 评论(35)

简介:

使用gulp-rev-append给页面的引用添加版本号,清除页面引用缓存。

1、安装nodejs/全局安装gulp/项目安装gulp/创建package.json和gulpfile.js文件

1.1、gulp基本使用还未掌握?请参看: gulp详细入门教程

1.2、本示例目录结构如下:

2、本地安装gulp-rev-append

2.1、github:https://github.com/bustardcelly/gulp-rev-append

2.2、安装:命令提示符执行 cnpm install gulp-rev-append --save-dev

2.3、注意:没有安装cnpm请使用 npm install gulp-rev-append --save-dev 什么是cnpm,如何安装?

2.4、说明:--save-dev 保存配置信息至 package.json 的 devDependencies 节点。为什么要保存至package.json?

2.5、效果如下:

3、配置html页面引用

3.1、gulp-rev-append 插件将通过正则(?:href|src)=”(.*)[?]rev=(.*)[“]查找并给指定链接填加版本号(默认根据文件MD5生成,因此文件未发生改变,此版本号将不会变)

4、配置gulpfile.js

4.1、基本使用(给页面引用url添加版本号,以清除页面缓存)

5、执行任务

5.1、命令提示符执行:gulp testRev

6、结束语

6.1、本文有任何错误,或有任何疑问,欢迎留言说明。

下载附件

如果觉得我的文章对您有用,请随意打赏。您的支持将是我继续创作的动力! ¥ 打赏支持 ¥

本站文章除注明转载外,均为原创文章,会经常更新知识点以及修正一些错误,因此转载请保留原出处,方便溯源,避免陈旧错误知识的误导,同时有更好的阅读体验。

http://www.ydcss.com/archives/49

相关推荐

评论

  1. 安装不了这个插件提示:
    npm WARN package.json gulp-rev-append@1.0.0 No repository field.
    npm WARN package.json gulp-rev-append@1.0.0 No README data
    npm WARN install Refusing to install gulp-rev-append as a dependency of itself

  2. 我执行后也没有任何变化,起码这是个应该容易出问题的地方

  3. 博主,请问这个插件和 “gulp-rev”+”gulp-rev-collector”的组合那个更好一点呢?

  4. 博主,请教个问题。requireJs配置里的引用缓存怎么处理呢?比如 var require = { baseUrl : ‘/src/’, //相对于定义了data-main的HTML paths: { ‘jq’ : ‘js/lib/jquery-1.11.1.min’, ‘cal’: ‘js/base/cal’ }};比如我更改了base/cal.js,这里的引用怎么处理

  5. Pingback: gulp详细入门教程 – 前端笔记

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

    • 你好,其实每个插件官方文档都非常详细啦,学会自学才是王道呀,点这里看看吧。https://www.npmjs.com/package/gulp-rev-all

输入关键字