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

Question

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

Answer 1

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

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

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

1. 发布时自动编译js和css文件，文件名为该文件的哈希值，文件内容不变，哈希值也不变，带哈希值的文件名即体现了文件版本。

2. 它可以替换引用js和css的文件，将其改为最终真实路径（js和css文件名都被替换）。