以文件修改时间戳做 CSS、JS 等文件的版本号,减少主动清理更新缓存的次数

编辑于:2021年12月18日
以文件修改时间戳做 CSS、JS 等文件的版本号,减少主动清理更新缓存的次数

每次修改 WordPress 的 cssjs 文件,都要主动清理文件的缓存才能生效,尤其是采用了 oss 和 cdn 回源。使用函数 filemtime() 获取文件修改时间戳,并以此做版本号,比如 my.js?ver=1639757946141 就不用再去手动刷新缓存了。

注意文件必须是 相对路径,使用绝对路径会报错。

使用函数 filemtime()

所用函数为 filemtime()

<link rel="stylesheet" href="wp-content/themes/wp/static/css/libs.css?ver=<?php echo filemtime(wp-content/themes/wp/static/css/libs.css); ?>" type="text/css">

<script type="text/javascript" src="wp-content/themes/wp/static/js/jquery.min.js?ver=<?php echo filemtime(wp-content/themes/wp/static/js/jquery.min.js); ?>"></script>

WordPress 引用脚本 css/js 范例

//get_template_directory() 获取函数获取主题模板目录
//wp_enqueue_style() 安全引入 css
//wp_enqueue_script() 安全引入 js
//代码中的 css 和 js 路径,请根据主题的实际路径修改

function theme_scripts() {
  wp_enqueue_style( 'style', get_stylesheet_uri(), array() , filemtime(get_template_directory() . '/style.css'));
  wp_enqueue_script( 'script', get_template_directory_uri().'/js/script.js', array(), filemtime(get_template_directory() . '/js/script.js') , true );
}
add_action( 'wp_enqueue_scripts', 'theme_scripts' );

相关推荐