首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Gulp rev将不会合并具有正确路径的清单文件

Gulp rev是一个用于静态资源版本控制的Gulp插件。它可以通过给静态资源文件名添加哈希值来解决浏览器缓存问题,从而实现静态资源的更新和缓存管理。

具体来说,Gulp rev插件会根据文件内容生成唯一的哈希值,并将该哈希值添加到文件名中,例如将"style.css"重命名为"style-af12b3.css"。这样,当静态资源文件内容发生变化时,文件名也会随之改变,从而迫使浏览器重新下载最新的文件。

然而,Gulp rev插件本身并不会合并具有正确路径的清单文件。清单文件是一个记录了原始文件名与哈希值对应关系的JSON文件,用于在后续的构建过程中更新文件引用。通常,开发者需要使用其他插件或自定义脚本来实现清单文件的合并和路径处理。

在使用Gulp rev插件时,可以结合其他Gulp插件来实现完整的构建流程。例如,可以使用Gulp concat插件来合并多个静态资源文件,使用Gulp rev-collector插件来更新HTML文件中的文件引用,使用Gulp useref插件来处理HTML中的构建注释等。

总结起来,Gulp rev插件是一个用于静态资源版本控制的工具,通过给文件名添加哈希值来解决浏览器缓存问题。但它本身不会合并具有正确路径的清单文件,需要结合其他插件来完成完整的构建流程。

腾讯云相关产品推荐:

  • 云开发(CloudBase):提供全栈云开发能力,包括云函数、云数据库、云存储等,适用于快速构建云原生应用。
  • 云服务器(CVM):提供可扩展的云服务器实例,适用于搭建网站、应用程序和数据库等。
  • 云数据库 MySQL版(TencentDB for MySQL):提供高性能、可扩展的云数据库服务,适用于存储和管理数据。
  • 对象存储(COS):提供安全、稳定、低成本的云端存储服务,适用于存储和管理大量的非结构化数据。

更多腾讯云产品信息,请访问腾讯云官方网站:https://cloud.tencent.com/

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Gulp实现css、js、图片压缩以及css、js文件MD5命名

目前做代码压缩合并具有很多,诸如gulp,webpack,grunt等等,可以说这些项目构建工具功能非常之强大:图片压缩、图片转base64、css和js压缩以及合并文件md5重命名 ……。...gulp-rev-collector --save-dev //- 路径替换 npm install gulp-clean --save-dev //- 用于删除文件 npm...目前index.html文件css和js引用路径是这样,如下图: ? 其他目录下html文件也是这样,都引用是未压缩和md5命名css和js文件。...所有的css和js文件都加了md5命名了,所有的图片体积也小了,但用肉眼看不出来图片质量有变化。 此时dist目录下所有的html文件引用css和js引用路径都变成带有md5命名了。...第六步:代码改动 如果后续代码有改动的话,执行一次gulp clean命令,再执行一次gulp rev 命令: gulp clean命令就可以把dist目录下生成所有文件全部删除,gulp rev命令根据新代码重新生成所有文件

12.1K80

Gulp折腾之路(III)

html里零碎这些引入合并成一个文件,当然它只负责合并,不负责压缩!...所以合并出来文件我们要自行压缩,压缩以后调用 gulp-rev 负责在文件名后追加hash(如果项目使用CDN容易造成缓存的话)。...最后调用gulp-rev-replace 抑或 gulp-rev-collector 负责把最终文件名替换回HTML中去;看起来是不是有些意思呢?...→ unicorn-d41d8cd98f.css gulp-useref识别的就是build开头注释,build后面首先跟是类型扩展名,然后后面的路径就是build区块中所有文件进行合并文件路径...-- endbuild -->内部,所引用资源得是本地,如果其中链接一发在线css/js,抱歉打包工作将不能很好进行了;再有其中如果引用js,也不能将书写js代码,只能是引用本地js文件;如果项目中有多个

1.2K50

gulp之自动化静态资源压缩合并加版本号

gulp之自动化压缩合并加版本号 这个方案主要是为了实现js/css/image压缩合并、自动添加版本号、自动加浏览器前缀和压缩html。...'), //js压缩 gulp-imagemin //压缩图片 gulp-htmlmin //压缩html gulp-clean //清空文件gulp-rev //更改版本名 md5后缀 gulp-autoprefixer...//加浏览器前缀 gulp-rev-collector //gulp-rev 插件,用于html模板更改引用路径 目录结构 |- root  |    |-dist  //此目录为下面生成 |       ...'),  //压缩html     clean = require('gulp-clean'),    //清空文件夹     rev = require('gulp-rev'),    //更改版本名...');    //gulp-rev 插件,用于html模板更改引用路径 //清空文件gulp.task('clean', function(){     return gulp.src('dist

1.1K10

Gulp 定制专属提速“外挂”(下)

毕竟Gulp插件太丰富了,大家也没有太多精力把所有的插件都去研究一遍。当一个网站进行改版升级时候,遇到静态资源版本更新问题,那么对于前端开发工程师来说,该如何解决这个问题?...gulp-asset-rev用于更改HTML文件引用静态资源路径gulp-rev用于修改静态资源文件名。....pipe(rev()) // 修改静态资源文件名 .pipe(assetRev()) // 更改HTML文件引用静态资源路径 .pipe(gulp.dest('dist/js'))...;// 复制到目标文件路径 }); gulp.task('rev',['revJS'],function() { gulp.src("./**/*.html") // 源文件所有HTML...', function () { // 需要合并文件 gulp.src('css/*.css') //合并文件名 .pipe(concat('common.css'

1.1K80

Gulp和Webpack对比

文件合并与压缩 上面的模块化中,我们提到了模块化其实很大一部分是在做文件合并与压缩操作,所以我们马上来看看Gulp和Webpack是怎样是想文件合并和压缩。...结论是正确Gulp可以对css文件以及js文件进行合并压缩处理,而Webpack可以实现对css文件,js文件,html文件等进行合并压缩和图片压缩,还可以对js文件进行编译(如es6–>es5,...js合并压缩 要想实现Gulp对js文件合并压缩需要安装一个gulp-uglify和gulp-concat两个模块,前者是用于压缩模块,后者是一个合并模块。 1....sass文件后保存,则立即执行sass预处理),配合Gulp启动server则可以实现sass文件修改保存即可在浏览器中查看效果目的,下一小节介绍启动本地server。...在项目中通过npm安装**gulp-rev**和**gulp-rev-collector**模块,前者用于生成文件MD5码文件和按MD5码命名资源文件,后者是利用MD5码,对文件名进行替换。

2.1K40

基于gulp前端自动化方案

项目目录关系到你gulp脚本里任务路径,我脚本里写是匹配所有的目录和文件。我简单举个例子:这里js/common里js文件也会被处理。如果只想处理特定目录文件,请修改任务里路径。...} } 编写gulp脚本 新建 gulpfile.js文件,并引入所需模块,这里我把路径统一写在PATHS中。...具体关于路径写法,可以去看gulp官网api:https://www.gulpjs.com.cn/docs/api/ gulp-minify-css这个官网提示已经弃用,改用gulp-clean-css...'),// 精简html htmlmin = require('gulp-htmlmin'),//压缩html rev = require('gulp-rev-append'),//增加版本号.../node_modules/**']) .pipe(rev()) .pipe(gulp.dest(PATHS.DEST)); }); 同步执行task 因为gulp所有的任务都是异步完成

1.1K60

gulp 自动添加版本号

本文介绍利用 gulp-rev 和 gulp-rev-collector 进行版本管理 npm官网介绍使用后效果如下: "/css/style.css" => "/dist/css/style-1d87bebe.css...: 对目标文件进行MD5计算序列值,更改文件名,生成键值对json文件(manifest文件,如上) gulp-rev-collector: 根据manifest文件对应关系,替换目标文件引用链接...v=c8571d8112" 即在不更改文件名,在引用文件名后加?v=hashVal方式。...v=' + file.revHash; 第二步:打开nodemodules\gulp-rev\nodemodules\rev-path\index.js 第10行 (如果找不到此文件,则找到路径nodemodules...权限问题,建议删除node_modules文件夹,把gulp插件重新构建  npm install 如果不行,看下是否是windows下gulp操作虚拟机中文件,如果是,尝试在虚拟机中重新安装node

1.2K50

Git 中文参考(五)

一种特别有用方法是查看添加文件是否具有通过现有文件复制和粘贴创建行。有时这表明开发人员很草率,并没有正确地重构代码。...Unspecified 没有模式匹配路径,没有任何说明路径是否具有属性,路径属性被称为未指定。 当多个模式与路径匹配时,后一行覆盖较早行。这个覆盖是按属性完成。...path/语法是没有意义;使用path/**代替) 在确定为路径分配了哪些属性时,Git 查询$GIT_DIR/info/attributes文件具有最高优先级),.gitattributes...但是,merge.default配置变量可以将不合并驱动程序命名为与未指定merge属性路径一起使用。 String 使用指定自定义合并驱动程序执行 3 向合并。...合并驱动程序可以通过占位符%P了解合并结果路径名。 conflict-marker-size 此属性控制冲突合并期间留在工作树文件冲突标记长度。仅将值设置为正整数具有任何有意义效果。

5610

gulp自动化打包(下)

,前边压缩合并js是自己写js),然后打zip包,发送至目的地。...那么这里配置输入输出路径即为: 路径以gulpfile.js为参考位置。...使用gulp-git 如果想打包git版本库中某一个版本,或者某一个分支,就需要用到git.checkout,但是在checkout之前,需要首先提交git版本,如果在git-bash下,进行如下操作...打zip包 经过合并压缩等操作之后,项目自动生成dist目录,dist目录下即为打包生成各种文件,接下来目标是将dist目录下所有文件打成一个zip包,代码如下: gulp.task('zip_new...2.要想达到第一点里面的同步执行(一个任务完成才开始下一个),一定要保证前面的所有任务,即除了ftp任务,其余方法一定要是return出来,即: 正确写法: gulp.task('js', function

1.2K20

前端工程化 | 揭秘程序员提速“外挂”

前端开发工作往往需要把LESS/SASS编译成CSS文件,对多个JS、CSS文件进行合并与压缩处理,对JS、CSS进行语法检查等,上面提到这些都是一些重复性操作,在开发过程中占据了大量时间,降低了开发效率...JavaScript、SASS、LESS、HTML、IMG、CSS等文件编译、检查、压缩、合并、格式化、浏览器自动刷新、项目打包,并监听文件在改动后重复指定这些操作。...,利用Node.js流威力,你可以快速构建项目并减少频繁IO(文件写入与读取)操作; 高质量:Gulp有严格插件指南确保插件如你期望那样简洁高质工作,而且Gulp每个插件只完成一个功能,各个功能通过流进行整合并完成复杂任务...解决方法是用管理员权限运行此文件,鼠标右击window图标,点击命令提示符(管理员)。之后把你安装包所在路径输入进去就行了,这样打开安装包就不会报错了。 ? ?...安装:执行命令npm install --global gulp进行全局安装Gulp。 执行gulp -v命令,出现版本号即为正确安装。 ?

1.3K110

Node.js基础

2.3 PATH环境变量 存储系统中目录,在命令行中执行命令时候系统自动去这些目录中查找命令位置。 ?...如果文件读取正确,err 是 null,返回doc doc是文件读取结果 写入文件内容 fs.writeFile('文件路径文件名称",'数据',callback); const...,系统自动在该路径开辟一个文件 5.3系统模块path路径操作 为什么要进行路径拼接 不同操作系统路径分隔符不统一 /public/uploads/avatar Windows上是\...6.第三方模块 6.1什么是第三方模块 写好具有特定功能、我们能直接使用模块即第三方模块,由于第三方模块通常都是由多个文件组成并且被放置在一个文件夹中,所以又名包。...6.6 Gulp能做什么 项目上线,HTML、CSS、 JS文件压缩合并 语法转换(es6、 less .

1.7K20

模块加载及第三方包

', 'utf-8', (err, doc) => { // 如果文件读取出错err是一个对象包含错误信息 //如果文件读取正确 err是null //doc是文件读取结果 ​...1.3.第三方模块 1 什么是第三方模块 别人写好具有特定功能、我们能直接使用模块即第三方模块,由于第三方模块通常都是由多个文件组成并且被放置在一个文件夹中,所以又名包。...6 Gulp能做什么 项目上线,HTML、CSS、JS文件压缩合并 语法转换(es6、less ...)...1 node_modules文件问题 文件夹以及文件过多过碎,当我们将项目整体拷贝给别人时候,,传输速度很慢很慢....假设它是系统模块 Node.js会去node_modules文件夹中 首先看是否有该名字JS文件 再看是否有该名字文件夹 如果是文件夹看里面是否有index.js 如果没有

1.8K30

npm、npm scripts

区别在于:当你把项目发布上线后,别人使用 npm install使用你项目时,并不会下载devDependencies里模块。 4、node_modules查找路径是怎样?...npm2安装依赖时候比较简单直接,直接按照包依赖树形结构下载填充至本地目录,缺陷在于太深目录树结构严重影响效率,甚至在window下可能超出系统路径限制长度,另外有删node_modules...使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并 gulp是前端开发过程中对代码进行构建工具,是自动化项目的构建利器 gulp不仅能对网站资源进行优化,而且在开发过程中很多重复任务能够使用正确工具自动完成...gulp是基于Nodejs自动任务运行器, 能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件测试、检查、合并、压缩、格式化、浏览器自动刷新...//文件合并 npm install gulp-rename --save-dev //重命名 //gulpfile.js //引入插件 var gulp = require('gulp'),

2.2K41
领券