Для меня это звучит так, будто вы немного сгибаете назначение Stencil и Web-компонентов. У меня никогда не было этой боли, но я отвечал на твой вопрос: это зависит от того, чего ты хочешь достичь. Например, вы можете использовать Jquery непосредственно внутри shadow-dom при импорте Jquery в Light-dom.
Index.html
<script src="/jquery.min.js"></script>
</head>
<body>
<my-component></my-component>
<div id="test2"></div>
</body>
my-component.tsx
testfunc(){
console.log($().jquery);
console.log($("#test"));
console.log($("#test2"));
}
render() {
return <div id="test">
<button onclick={this.testfunc.bind(this)}>asd</button>
</div>;
}
Результат testfunc находится здесь: 
Итак, как вы можете видеть - вы уже можете использовать Jquery, просто вставив его в основное приложение. Но есть некоторые ограничения, поскольку вы можете видеть, что у вас есть доступ ко всем элементам DOM из light-dom, но нет из shadow-dom. Вот почему #test не был найден, а # test2 был.
Но интересно отметить, что я также смог загрузить файл внутри этого контейнера # test2 div, который находится в index.html. Просто используя функцию jquery .load из веб-компонента.
$( "#test2" ).load( "/index.html" );
Все становится немного сложнее, когда вы хотите использовать селектор $ для получения элементов внутри веб-компонента (shadow-dom), но для этого нет абсолютно никаких причин: у Stencil есть собственный this.el.shadowRoot.querySelector (), который вы можете использовать внутри компонента или напрямую прикрепить переменную к элементу DOM, например:
render() {
return <div ref={el => this.element = el}>
<button onclick={this.testfunc.bind(this)}>Press Button</button>
</div>;
}
Чем вы можете использовать this.element внутри веб-компонента для доступа к div. Но в целом вы также можете попробовать использовать флаг scoped в компонентном декораторе. Чем обычно вы можете использовать все из «легкого дома», потому что нет такой жесткой изоляции:
@Component({
tag: 'my-component',
styleUrl: 'my-component.css',
shadow: true ---> instead of this
scoped: true ---> try this
})
Подводя итог: я думаю, что никогда не бывает веской причины использовать эти библиотеки внутри веб-компонента. в общем. Но если вам действительно нужно - это всегда зависит от ваших потребностей и того, чего вы хотите / должны достичь. Трафарет имеет несколько действительно полезных и хороших встроенных функций.