H5W3
当前位置:H5W3 > 其他技术问题 > 正文

如何快速给HTML中的js和css文件添加版本号?

找到了用gulp实现的方法,但是每次都要安装配置感觉还是略微繁琐。
我目前用的主力是vscode,其实只要能在页面加载之前操作HTML里面的DOM元素,获取到所有的js和css文件,在后缀加一个当前的时间戳,思路是这样的,就是不知道有没有相关插件。
大家平时用的是什么方法呢,求分享~

回答:

你提到的给所有js,css文件添加时间戳的方法对于小网站来说无所谓,完美解决客户端缓存问题。副作用是本来大部分的js,css文件根本没有变化,也要强制客户端重新加载新版本,降低了页面展示速度,不推荐。
邪道
非要用的话,不用到处找插件,可以自己写个 pathBuilder(filePath) 模板方法,这个方法的作用就是给传入的路径后添加一段时间戳。 然后你在模板文件中调用这个方法引入js和css文件。比如

<srcipt src="{pathBuilder('../js/index.js')}"></script>

正道
使用Webpack是目前非常完美省力的解决方式,因为它可以:

  1. 发布时自动编译js和css文件,文件名为该文件的哈希值,文件内容不变,哈希值也不变,带哈希值的文件名即体现了文件版本。
  2. 它可以替换引用js和css的文件,将其改为最终真实路径(js和css文件名都被替换)。

本文地址:H5W3 » 如何快速给HTML中的js和css文件添加版本号?

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址