简介
@os33/gulp-rev 是一款针对 gulp 前端构建工具的插件,能够为文件添加 hash 值,避免版本更新后浏览器缓存的问题。
安装
--- ------- -------------- ----------
使用
基本用法
----- ---- - ---------------- ----- --- - -------------------------- ---------------- -- -- ----------------------- -- ---- ---- ---- ------------ ------------------------ --
将 src/**/*.js
中的所有 js 文件添加 hash 值后输出到 dist
目录下。
配置选项
可以通过参数配置 rev 的行为。
----- ---- - ---------------- ----- --- - -------------------------- ----- ---------- - ---------------------------- ---------------- -- -- - ----- ------- - - ----------------------- -------- ------ -------- -- - -------- ------------- ------- ------ -- - ------ ----------------------------------------- -- ------- -- --------- --------------------------------- -- ----- ------------- -- ------ ----------------------- ------------------- ------------------------ --------------------- --------------------------- -- -------- ---- --------------------------- ------------------------------------ -- -- ---- ------ ---------------------------- ---
includeFilesInManifest
类型:string[]
默认值:[]
说明:若指定,将生成的 manifest.json 文件中,对应的 key 将会添加源文件中的这些后缀名的文件,这些文件将会被复制到输出文件夹的目录中。
rename
类型:(file: { history: string[], cwd: string, base: string, path: string, stat: fs.Stats }, opts?: { keepExt?: boolean, overwrite?: boolean }) => string
默认值:undefined
说明:若指定,将对文件名进行修改。该选项接收一个函数,传入的参数为当前文件的路径信息和一些额外选项,函数返回重命名后的文件名。
选择该选项,可以给文件名添加前缀等。
manifest
类型:NodeJS.ReadWriteStream
默认值:undefined
说明:若指定,将使用给定的 manifest.json 文件。
一般情况下不需要指定,若需要通过替换 html 中的引用路径的插件来使用这个 manifest,需要给插件指定参数:{ manifest: gulp.src('path/to/manifest.json') }
。
示例代码
--------- ----- ------ ------ ----- ---------------- --------------- ---------- ----- ---------------- ------------------------------ ------- ------ ---- --------------------------- ----------- ------- ---------------------------------- ------- -------
- - -------------- ----- ------ ----- ----------------- ------------------------------ -
----- ---- - ---------------- ----- --- - -------------------------- ----- ---------- - ---------------------------- ---------------- -- -- - ----- ------- - - ----------------------- -------- ------ -------- ------- ------ -- - ------ ----------------------------------------- - -- ------ ------------------------------------------ -------------- ------------------- ------------------------ --------------------- ------------------------ --------------------------- ------------------------------------- ------------------------- ---
总结
以上就是对于 npm 包 @os33/gulp-rev 的使用教程,让我们可以轻松地为前端资源添加 hash 值,优化页面缓存问题。同时,通过灵活配置选项,@os33/gulp-rev 还能处理其他更加复杂的情况,为我们的前端开发带来更多便利和灵活性。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/6005570881e8991b448d3ef7