Полимерный элемент с зависимостями javascript

Я создал полимерный элемент для рендеринга markdown который использует отмечены.библиотека js. Мне было интересно, каков рекомендуемый способ загрузки в его зависимости?

должен ли я просто использовать тег сценария?

<script src="../marked/lib/marked.js"></script>

или было бы лучше поместить все мои зависимости в импорт html и ссылку на этот файл. В этом случае у меня только одна зависимость, но я мог бы легко иметь больше.

<!-- in scripts.html -->
<script src="../marked/lib/marked.js"></script>
<script src="../foo/foo.js"></script>
<script src="../bar/bar.js"></script>

<!-- in mark-down.html -->
<link rel="import" href="scripts.html">

примечание: эти пути предполагают мои элемент (и его зависимости) устанавливаются с bower, поэтому все они должны быть братьями и сестрами в bower_components.

1 51
polymer

1 ответ:

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

мы предлагаем два способа для обработки общих зависимостей:

  1. всегда используйте канонический путь что это ../<package-name> (вы уже это сделали). Полимер по соглашению ожидает папку с плоской зависимостью (как поддерживается Bower), поэтому любой ресурс, который вам нужен, всегда должен быть на этом пути.
  2. относятся к импорт для общего ресурса.

в этом случае

<script src="../marked/lib/marked.js">

соответствует первой конвенции. Ваш компонент может зависеть от marked пакет и ожидать, что он будет существовать в ../.

вторая конвенция поддерживает совместное использование. Если более чем один компонент в проекте используется script тег для загрузки библиотеки, библиотека будет загружаться несколько раз. Импорт, с другой стороны, де-дублируются, так что у вас нет этой проблемы.

например, если все компоненты нагрузки marked стандартным способом:

<link rel="import" href="../marked-import/marked-import.html">

тогда у вас будет только одна копия загруженного скрипта.

кроме того, импорт позволяет опосредовать фактический ресурс. Например, обычно marked-import зависит от marked и использовать script тег для загрузки JavaScript. Но фактически, любой конкретный автор проекта может изменить локальный marked-import.html чтобы загрузить основной код из CDN или из любого другого места. Путем косвенного доступа через импорт мы создаем единую точку управления.

сегодня, marked и другие библиотеки не включают файлы импорта, поэтому мы должны заполнить эти пробелы. Кроме того, это потребует координации с другими компонентами (чтобы иметь соглашение о том, какое стандартное имя импорта будет для любого конкретного общего ресурса). Как (и если) эти конвенции будут приняты, такие вопросы будут уменьшаться с течением времени.

Итак, ваш установленный компонент будет выглядеть примерно так:

/components
  /mark-down - depends on marked-import
  /marked-import - (controlled by user, can just depend on `../marked`)
  /marked
50