Можно ли встроить компонент Svelte в приложение, отличное от Svelte? - PullRequest
2 голосов
/ 10 апреля 2020

Я работаю в группе, в которой есть несколько проектов, и каждый из них написан в своей структуре Нам бы хотелось иметь несколько автономных виджетов, поведение и внешний вид которых стандартны, но могут использоваться в любой из систем. Я думал, что Svelte звучит как хороший вариант, потому что это не требует добавления фреймворка на переднем конце. Но я не могу найти ничего, что говорит, что Svelte можно использовать в других системах; это должно быть приложение Svelte, чтобы иметь компоненты Svelte.

Это правильно? Или есть какой-нибудь способ встроить компонент Svelte в другую систему?

Ответы [ 2 ]

1 голос
/ 16 апреля 2020

Вы можете включить компонент Svelte где угодно, как только у вас появится ссылка на элемент DOM, к которому вы хотите добавить свой компонент Svelte.

const container = document.querySelector('.container');

//MyComponent is the compiled component
new MyComponent({
  target : container
});

См. https://svelte.dev/docs#Client -side_component_API

Но тогда у вас есть некоторые ограничения на то, как вы можете обрабатывать состояние, если у вас есть несколько таких компонентов.

0 голосов
/ 11 апреля 2020

Так как вы не можете использовать, например, компонент Angular в React, вы также не можете повторно использовать компонент svelte в другом JS -Framework.

Существуют различные способы работы каркасов. Как обрабатывать импорт, выходные данные и «двустороннее связывание». Angular Компоненты могут быть модулями ... Зависимости для каждого каркаса не одинаковы, если вы используете, например, MaterialUI или другие вещи, связанные с каркасом.

Вы можете повторно использовать условия CSS / S CSS и PUG / HTML templates.

Кстати, это может быть подходящим решением для подготовки шаблонов PUG (более абстрактных, чем html) и шаблонных макетов s css. Но они должны быть реализованы для каждой структуры. Svelte, так как другие инфраструктуры должны быть настроены для предварительной обработки S CSS или PUG.

...