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

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

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

Библиотека	Для чего	Docs	Version
lodash	Мощные служебные функции для массивов, коллекций, JS-функций, JS-объектов, строк, чисел, математики, последовательностей	https://lodash.com/docs/	4.17.21
uuid	Создавайте, анализируйте и проверяйте UUID версии с 1 по 5	https://github.com/uuidjs/uuid	9.0.0（Support v1/v3/v4/v5）
numbro	Мощный помощник по форматированию чисел	https://numbrojs.com/format.html	2.3.6
papaparse	Синтаксический анализатор для преобразования CSV в JSON	https://www.papaparse.com/docs	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 в качестве примера и импортируем его на уровне приложения и рабочей области.

• Страница на GitHub: https://github.com/piuccio/cowsay
• Ссылка на Unpkg: https://unpkg.com/cowsay@1.5.0/build/cowsay.umd.js

  • Ссылка на JSDeliver: https://cdn.jsdelivr.net/npm/cowsay@1.6.0/build/cowsay.umd.min.js

Вы можете проверить популярные 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. Установленные библиотеки доступны из любого приложения в вашем рабочем пространстве.