自定义脚本和css版本控制的最佳实践和gruntjs自动化

Question

我决定开始对我在WP主题中使用的自定义css和js文件进行版本控制，这样当我更新网站时，就不需要重新加载页面来向用户显示更改（我知道早该这么做了）。

只是在调用结束时添加一个版本号作为查询字符串并保持真实文件名静态是一种好的做法吗（如"script.js？v=xyz"）？如果版本号没有更改，这将如何影响浏览器缓存？它会正常缓存吗？当我更改版本号时，它只会得到一个新版本吗？

如果以上是可行的，我想用Grunt自动化这一点，所以当我运行"构建"命令时，文件在WP中排队的PHP文件会被修改为包含一个随机哈希+日期作为WP_enque_script命令中的版本参数。我认为，当我用livereload和所有东西运行我的开发命令时，具有所述版本的脚本不会影响liverelead，所以我不需要删除版本控制，对吗？你将如何做到这一点，你将使用什么npm模块，以及我需要添加到Gruntfile.js中的命令是什么？

顺便说一句，我知道wordpress默认添加到所有脚本和css的版本号被认为是一个安全风险，因为它暴露了你正在滚动的WP版本，我一直在通过functions.php删除它，但是，我想启用它，但它不使用WP版本，而是随着每次WP更新而随机更改的版本号。你知道如何实现这一点吗？我很惊讶，我没能找到一个插件做到这一点。

非常感谢社区！

Answer 1

我当然已经这样做了，作为向浏览器指示他们应该下载新版本的样式表的一种方式。这不是特别优雅，但我做了一件事，将缓存破坏参数（在您的示例中为xyz）声明为PHP常量：

// inc/constants.php
define('CACHEPARAMETER', '20161027');

我的grunt构建任务使用grunt文本替换修改了这一点：

replace: {
        cacheparam: {
            src: ['inc/constants.php'],
            overwrite: true,                 // overwrite matched source files
            replacements: [{
                from: /'CACHEPARAMETER', '[0-9]{8}'/g,
                to: "'CACHEPARAMETER', '<%= grunt.template.today('yyyymmdd') %>'"
            }]
        }
    }

我正在functions.php中排队，我喜欢它：

include "inc/constants.php";
wp_enqueue_style( 'my-style', get_stylesheet_uri(), array(), CACHEPARAMETER);

希望这能有所帮助。