Сторонние библиотеки

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

Встроенные библиотекиApeekflow предоставляет для использования некоторые встроенные библиотеки JavaScript.

Библиотека
Для чего
Docs
Version

lodash

Мощные служебные функции для массивов, коллекций, JS-функций, JS-объектов, строк, чисел, математики, последовательностей

4.17.21

uuid

9.0.0(Support v1/v3/v4/v5)

numbro

Мощный помощник по форматированию чисел

2.3.6

papaparse

Синтаксический анализатор для преобразования CSV в JSON

5.3.2

Встроенные библиотеки можно использовать непосредственно везде, где вы можете использовать JavaScript.

// loadash
return _.chunk(['a', 'b', 'c', 'd'], 2);
// => [['a', 'b'], ['c', 'd']]

// uuid
return uuid.v4();
// => 3965f3d4-8dd8-4785-9756-0ee98d91238d

// numbro
return numbro(1000).format({thousandSeparated: true});
// => 1,000

// Papaparse
return Papa.parse("name|age\nJohn Doe|30\nJane Doe|25", {delimiter: "|"})
// => {"data":[["name","age"],["John Doe","30"],["Jane Doe","25"]],"errors":[],"meta":{"delimiter":"|","linebreak":"\n","aborted":false,"truncated":false,"cursor":32}}

Импорт сторонних библиотек

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

Поддерживаются только библиотеки, использующие подход UMD (Universal Module Definition).

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

  • Библиотеки уровня приложения загружаются только в том приложении, в котором они были определены. Это означает, что библиотека, импортированная в приложение A, не загружается в приложение B. Верно и обратное. Библиотека, импортированная для приложения B, недоступна для применения в приложении A, если она не импортирована в приложение A явным образом.

  • Библиотеки уровня рабочей области будут загружаться при открытии любого приложения в рабочей области. Все приложения могут получить доступ к этим библиотекам (и будут загружаться автоматически).

Импорт сторонних библиотек может повлиять на производительность приложения, особенно если у вас сложные функции JavaScript. Тщательно продумайте способ импорта на уровне приложения или рабочей области

Советы, которые вы должны знать перед настройкой библиотек:

  • Внешние библиотеки загружаются и запускаются в браузере.

  • Библиотеки, предназначенные только для Node JS, не поддерживаются.

  • URL-адреса внешних библиотек должны поддерживать междоменную связь.

  • Экспорт библиотеки должен быть настроен непосредственно в объекте window, глобальные переменные, такие как var xxx = xxx, не вступают в силу.

  • Внешние библиотеки работают в изолированной среде, и следующие глобальные переменные недоступны:

    parent

    document

    location

    chrome

    setTimeout

    fetch

    setInterval

    clearInterval

    setImmediate

    XMLHttpRequest

    importScripts

    Navigator

    MutationObserver

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

Вы можете проверить популярные CDN, размещают ли они нужную вам библиотеку в виде уменьшенного пакета.

https://jsdelivr.com

https://cdnjs.com

https://unpkg.com

Импорт / привязка на уровне приложения

Перейдите на страницу настроек и нажмите на значок плюс на вкладке Библиотека JavaScript. Вставьте ссылку Библиотека и нажмите Добавить новую. Теперь Apeekflow проверит, будет ли внешняя библиотека совместима и безопасна для использования.

Вы также можете нажать на значок загрузки, чтобы быстро загрузить любую рекомендованную библиотеку JS.

Теперь вы можете создать JS-запрос и вставить код.


return window.cowsay.say({
    text : "Apeekflow is cool", e : "oO", T : "U "
})

Обратите внимание, что в нашем примере библиотека cowsay импортируется на уровне приложения, и вы не можете использовать ее в любом другом приложении в своей рабочей области.

После успешного импорта библиотеки cowsay вы должны увидеть что-то похожее на изображение ниже. Обратите внимание, что вы видите, какую глобальную переменную вы можете использовать для доступа к библиотеке.

Импортированные внешние библиотеки привязаны к объекту window.

cowsay.say(...) не будет работать

window.cowsay.say(...) — выполняет свою работу.

Импорт/привязка на уровне рабочей области

Перейдите на домашнюю страницу ApeekFlow, выберите Настройки > Дополнительно и нажмите Добавить на вкладке Библиотека JavaScript. Вставьте ссылку на стороннюю библиотеку JS и нажмите Добавить новую, чтобы добавить ее в свою рабочую область. Вы также можете нажать на значок загрузки, чтобы быстро добавить любую рекомендуемую библиотеку JS. Установленные библиотеки доступны из любого приложения в вашем рабочем пространстве.

Last updated