Как обходиться с двойными импортами?

Question

[symnoob]

Как обходиться с двойными импортами?
Например, у меня есть два класса в обоих необходимо импортировать bootstrap:

JS1:

import Modal from 'bootstrap/js/dist/modal';

export default class WTF {
}

JS2:

import Modal from 'bootstrap/js/dist/modal';

export default class WTF2 {
}

теперь когда я нажимаю открыть Модальное окно, оно открывается, но при этом события shown.bs.modal вызывается два раза.

Comments

[Сергей Соколов]

гадать будем, какая версия BS, что происходит при нажатии на кнопку — или код покажете?

[symnoob]

версия 5.1

Окно открывается, всё как положено. Но я так думаю что я получаю 2 инстанции. Так как событие 2 раза выстреливает

[Ivan1331]

symnoob, а при чём тут инсталляция? Она же просто выгружает нужный код, а не вызывает его

[Сергей delphinpro]

С импортами всё нормально.
Проблема в вашем коде ниже, который вы не показали. Там где вы слушателей назначаете.

[symnoob]

Сергей Соколов , Сергей delphinpro , Ivan1331 Да нет, вот первый скрипт который подвязывается к HTML: EasyAdmin

Во втором скрипте даже хватает этого:

import Modal from 'bootstrap/js/dist/modal';

export default class WTF {
}

естественно, получаем instance: new WTF();

ну и простая кнопка для отрытия модального окна:

<div class="modal fade" id="exampleModalToggle" aria-hidden="true" aria-labelledby="exampleModalToggleLabel" tabindex="-1">
<!-- Ну и здесь весь оставшийся скелет модального окна-->
</div>
<a class="btn btn-primary" data-bs-toggle="modal" href="#exampleModalToggle" role="button">Open Modal</a>

Ну и когда окно открывается, в инспекторе кода видно как бы две инстанции (окно как бы два раза открылось):

<div class="modal-backdrop fade show"></div>
<div class="modal-backdrop fade show"></div>