我有一个角度7应用程序,我有一个使用tippy.js 4.0.2创建工具提示的指令。这在本地模式(ng服务)上完全正常。但是,只要我尝试将它集成到我的服务器上运行的页面(其中tippy.js 2.6.0作为全局变量),当单击具有工具提示的元素时,鼠标上会出现以下错误:
TypeError:我未定义tippy.all.min.js:1:23177
为什么这两个版本的tippy会干扰?我该如何修复这个bug?
我的tippy指令包含以下重要部分:
import {
Instance as TippyInstance,
Props as TippyOptions,
default as tippy,
} from 'tippy.js';
/** fake component needed to be able to include tippy theme styles */
@Component({
selector: "[tooltip]",
template: `<ng-content></ng-content>`,
styleUrls: [
'../../../node_modules/tippy.js/themes/light.css',
],
encapsulation: ViewEncapsulation.None
})
@Directive({
/* tslint:disable-next-line */
selector: '[tooltip]',
})
并动态更新更新我使用的选项
if (!this.tippyInstance) this.tippyInstance = tippy(this.el.nativeElement, this.tippyOptions || undefined) as TippyInstance;
else this.tippyInstance.set(this.tippyOptions);
我无法解决问题,但是在我的角度项目中对tippy.js v2.6.0进行降级使得错误按预期消失。