gulp为项目文件添加版本号

最新推荐文章于 2024-07-13 05:22:31 发布

YinghaoGuo

最新推荐文章于 2024-07-13 05:22:31 发布

阅读量3.7k

点赞数 2

分类专栏：构建工具篇文章标签： gulp 版本号 gulp添加文件版本号

本文链接：https://blog.csdn.net/qq_22855325/article/details/76582589

版权

本文介绍如何通过修改gulp相关插件源码，实现不改变文件名的情况下，使用'？+参数'方式为项目中的css和js文件添加版本号。详细讲述了修改node_modules中的gulp-rev、rev-path、gulp-assets-rev和gulp-rev-collector等模块的步骤，确保每次文件更新后版本号能正确更新。

摘要由CSDN通过智能技术生成

先说一下本文讲的是什么。

你一定看过这种带参的css或js文件，每次发布版本，专业一点的话，都会对新版文件打个tag。为了和上一版本的文件做区分，就可以通过这种‘？+参数’ 的方式做版本标记。

注：gulp插件原本的版本号更新方式不是这样，而是直接更改文件名，比如index.css更新为index-abcdefg.css类似这样子，这样一来每次更新版本的同时，还要对文件重命名，然而我们有时可能不想重命名，所以选择“？+参数”方式，不用改变文件原本名称，就像ajax的get方法，末尾加参数，却不影响文件原来在页面中的显示效果（这个例子也不好）。

初学这东西也是百度了几个文档，照着文档来搞，MD百度上文档都一个熊样儿，大家互相抄袭，所以我没有成功，可能是我用的cnpm而是不npm，也可能是版本原因吧，最后通过简单查看了一下npm的包中的index.js源码，问题还是被我解决了。过程如下：

（1）首先还是在项目目录安装包，需要五个包：

1 npm install --save-dev gulp
2 npm install --save-dev gulp-rev
3 npm install --save-dev gulp-rev-collector
4 npm install --save-dev gulp-asset-rev
5 npm install --save-dev run-sequence

我的项目目录结构如下：