Basel主题下WooCommerce变体图片点击无法上传问题求助

问题场景 #

使用Xtemos Basel主题时，产品变体功能中点击图片上传无响应；切换至Storefront主题后问题依旧，核心报错如下：

12The resource <URL> was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
2meta-boxes-product-variation.min.js:1 Uncaught TypeError: wp.media.controller.Library is not a constructor
    at HTMLAnchorElement.add_image (meta-boxes-product-variation.min.js:1:7690)
    at HTMLDivElement.dispatch (jquery.min.js:2:43184)
    at y.handle (jquery.min.js:2:41168)
5meta-boxes-product-variation.min.js:1 Uncaught TypeError: wp.media.controller.Library is not a constructor
    at HTMLAnchorElement.add_image (meta-boxes-product-variation.min.js:1:7690)
    at HTMLDivElement.dispatch (jquery.min.js:2:43184)
    at y.handle (jquery.min.js:2:41168)
add_image @ meta-boxes-product-variation.min.js:1
dispatch @ jquery.min.js:2
y.handle @ jquery.min.js:2
DevTools failed to load source map: Could not load content for chrome-extension://liecbddmkiiihnedobmlmillhodjkdmb/js/companionBubble.js.map: System error: net::ERR_BLOCKED_BY_CLIENT

解决方案 #

• 版本兼容性检查：确保WordPress核心和WooCommerce均为最新稳定版本，或使用官方文档标注的兼容版本组合。版本不匹配常导致媒体库脚本加载异常。
• 强制加载媒体库脚本：在主题的functions.php文件或自定义插件中添加以下代码，确保产品编辑页面正确加载媒体库相关脚本：

function fix_variation_media_script() {
    if ( isset( $_GET['post_type'] ) && $_GET['post_type'] === 'product' ) {
        wp_enqueue_media();
    }
}
add_action( 'admin_enqueue_scripts', 'fix_variation_media_script' );

• 插件冲突排查：禁用所有非WooCommerce官方插件，逐个重新启用并测试，定位冲突插件后选择更新或替换。
• 浏览器环境排查：清除浏览器缓存，禁用广告拦截等扩展（报错中存在扩展资源加载失败提示，可能干扰脚本执行），再测试上传功能。

报错原因说明 #

wp.media.controller.Library is not a constructor错误表明，触发图片上传时，媒体库核心构造函数未被正确加载或初始化，导致无法唤起上传弹窗。上述方案均围绕修复脚本加载逻辑、排除外部干扰展开。

内容的提问来源于stack exchange，提问作者Divya