反注册WordPress主题或插件中的 JavaScript 和 CSS 文件


在开发WordPress主题的时候,为了实现更好的效果和加快开发速度,我们经常会使用一些插件,而很多插件会注册自己的 JavaScript 文件和 CSS 文件到前端,很多时候,为了和主题更好的结合,我们可能需要把插件的 CSS 或 JS 文件集成到我们开发的主题中。这时候插件自带的 JavaScript 文件和 CSS 文件就是多余的了,从性能角度考虑,我们需要把插件加载到前端的这些文件去掉,WordPress 为我们提供了 wp_deregister_script 和 wp_deregister_style 函数来实现这个需求,具体的使用方法,我们来看一下示例代码。

WordPress 是怎么加载文件到前端的

我们先看一下 WordPress 是怎么加载文件到前端的,反注册就是加载文件的一个相反的过程。下面的代码中,wizhi-style 和 wizhi-script 分别是 JavaScript 和 CSS 文件的 Handle,我们在下面的反注册过程中,也需要用到。

// 注册样式文件
add_action( 'wp_enqueue_scripts', 'register_plugin_styles' );
function register_plugin_styles() {
	wp_register_style( 'wizhi-style', plugins_url( 'my-plugin/css/plugin.css' ) );
	wp_enqueue_style( 'wizhi-style' );
}

反注册插件中的 JavaScript 和 CSS 文件

在下面的代码中,函数的参数就是需要反注册文件的 Handle 名称,为了找到这个名称,我们需要看一下插件的源代码,方法很简单,直接搜索插件文件夹的中 wp_enqueue_style 和 wp_enqueue_script 即可。

// 清理不需要的 CSS 文件
add_action('wp_print_styles', 'wizhi_print_css');
function wizhi_print_css() {
  wp_deregister_style('wizhi-style');
}

// 清理不需要的 JS 脚本
add_action('wp_print_scripts', 'wizhi_print_scripts');
function wizhi_print_scripts(){
  wp_deregister_script('wizhi-script');
}

反注册插件中的 JavaScript 和 CSS 文件可以减少 WordPress主题的前端 HTTP 请求数量,同时可以降低插件中的 JavaScript 或 CSS 与主题中响应的代码冲突的可能性,相信对自己要求比较高的 WordPress开发者都会有这方面的考虑。

  • 分享:
评论
还没有评论
    发表评论 说点什么