Как изолировать выполнение кода JS, так что каждый скрипт выполнялся в «контейнере»? Попробовал Shadedom и Iife, не выпо ⇐ Javascript

[Anonymous]

У меня есть 2 файлы JS - dashboard.js и centuspanel.js. Они отображают компоненты реагирования внутри Div, который имеет название сценария, как это идентификатор. Например, в моем приложении JSF. < /P>

Код: Выделить всё

< /code>
Когда есть один компонент на страницу, проблем вообще нет. Но если у меня есть более одного компонента, то есть столкновение в именах переменных. Так что, если я сделаю это < /p>




< /code>
Я получаю эту ошибку < /p>
dashboard.js:1 Uncaught SyntaxError: Identifier 'Wc' has already been declared (at dashboard.js:1:1)
< /code>
Я искал Интернет и нашел 2 способа, возможно, решить проблему. Первый подход использует Shadowdom. < /P>



(function () {
const shadowHost = document.getElementById("#{cc.attrs.name}_host");
const shadowRoot = shadowHost.attachShadow({mode: 'open'});

const div = document.createElement('div');
div.id = "#{cc.attrs.name}";
shadowRoot.appendChild(div);

const script = document.createElement("script");
script.src = `http://localhost:8900/microfrontends/#{cc.attrs.name}/#{cc.attrs.name}.js`;
shadowRoot.appendChild(script);

const link = document.createElement("link");
link.rel = 'stylesheet';
link.href = `http://localhost:8900/microfrontends/#{cc.attrs.name}/#{cc.attrs.name}.css`;
shadowRoot.appendChild(link);
})();


< /code>
Но я все еще получаю такую ​​же ошибку. Кроме того, сценарий находит только Div за пределами Shadowdom, он не видит, что внутри (я действительно удалил Div выше Shadowdom). < /P>
Uncaught SyntaxError: Identifier 'Wc' has already been declared (at dashboard.js:1:1)

Так что я попробовал второй подход - обернув мой сценарий с помощью функции глобальных переменных.

Код: Выделить всё

(function () {
var script = document.createElement('script');
script.src = 'http://localhost:8900/microfrontends/#{cc.attrs.name}/#{cc.attrs.name}.js';
document.head.appendChild(script);
})();



< /code>
Однако я все еще получаю ту же ошибку. < /p>
Uncaught SyntaxError: Identifier 'Wc' has already been declared (at dashboard.js:1:1)

Я также пытался изменить автозагенерированные файлы JS (панель панели и Statuspanel), где я заменил Var, но эти разрывы. Так что это не вариант. Использование iframe не является вариантом.

Подробнее здесь: https://stackoverflow.com/questions/795 ... uted-withi