记一次解决埋点代码的 jQuery 与客户网站版本冲突(noConflict 也无效, 与 jQuery-ui 有关)

背景

公司提供埋点代码给客户网站上埋点, 实现在线聊天/留言表单功能, 埋点代码中有 jQuery 代码, 客户网站也有 jQuery 代码, 客户说一埋上我们的代码控制台就报错

控制台报错信息如下:

jquery-ui.min.js:formatted:18 Uncaught TypeError: Cannot read properties of undefined (reading 'version')
Uncaught TypeError: owl.owlCarousel is not a function

跳转到报错处并格式化代码, 文件如下:

define(['jquery'], function($) {
    'use strict';
    function dialogPatch() {
        $.widget('ui.dialog', $.ui.dialog, {
            _createTitlebar: function() {
                this.options.closeText = $('<a>').text('' + this.options.closeText).html();
                this._superApply();
            },
            _setOption: function(key, value) {
                if (key === 'closeText') {
                    value = $('<a>').text('' + value).html();
                }
                this._super(key, value);
            }
        });
    }
    return function() {
        var majorVersion = $.ui.version.split('.')[0] // 此处报错
          , minorVersion = $.ui.version.split('.')[1];
        if (majorVersion === 1 && minorVersion >= 12 || majorVersion >= 2) {
            console.warn('jQuery patch for CVE-2016-7103 is no longer necessary, and should be removed');
        }
        dialogPatch();
    }
    ;
});

解决过程:

1. 查看控制台报错, 发现是 jquery-ui.min.js 报错, 点击转到源码处, 格式化代码, 发现是 $.ui.version 报错 $.ui undefined
2. 打断点, 清空缓存刷新页面, 发现 $.fn.jquery 确实是我们的 jQuery 版本号 (1.11.3), 说明这里用的 $ 确实是我们引入的 jQuery
3. 查看我们的埋点代码, 发现我们引入 jQuery 后马上写了 jQuery.noConflict(true) 解除绑定了, 按理说不会有版本冲突啊??

找不到原因, 只能瞎蒙

1. 怀疑 jQuery 源码和调用 noConflict 之间有空隙被乘虚而入了(实际觉得这不可能吧?), 于是改为把 noConflict 这一步直接写到源码里(反正我们的埋点代码里也没咋用 jQuery), 然而客户网站仍然报错

2. 发现报错代码里开头是 define 引入 jQuery , 而 jQuery 源码里也有个 define , 尝试去掉我们源码里这个, 客户网站没报错了, 解决