How to quickly add version numbers to js and css files in HTML?

found a way to implement it in gulp, but it feels a little tedious to install and configure it every time.
the main force I currently use is vscode,. In fact, as long as you can manipulate the DOM element in HTML before the page is loaded, get all the js and css files, and add a current timestamp to the suffix, the idea is like this, that is, I don"t know if there are related plug-ins.
what method do you usually use? ask for sharing.

Cache nginx apache visual-studio-code

Mar.31,2021

the method you mentioned to timestamp all js,css files doesn't matter to small websites, which perfectly solves the client-side caching problem. The side effect is that most of the js,css files are not changed at all, and the client is forced to reload the new version, which slows down the display speed of the page and is not recommended.
Evil
if you have to use it, you don't have to look for plug-ins everywhere. You can write a pathBuilder (filePath) template method by yourself. The purpose of this method is to add a timestamp to the incoming path. Then you call this method in the template file to introduce the js and css files. For example,

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

right path
using Webpack is a perfect labor-saving solution at present, because it can:

automatically compiles js and css files when they are released. The file name is the hash value of the file. The file content and hash value remain the same. The file name with hash value reflects the file version.
it can replace files that reference js and css and change them to the final real path (both js and css filenames are replaced).

Previous: How to tell the difference between installing third-party libraries in production dependencies and developing dependencies

Next: Php how to merge arrays according to the same key value in the same array