@itgenio/edik-compiler

edik-compiler/edik-bundler

Сборки

Можем собрать две сборки

Сборка для плеера

Нужна для исполнения в runtime-e и изменения/дополнения логики приложения, например:

• кастомный компонент
• работа с объектами на сцене(создать новый объект, повесить компонент и т.д.)

Сборка для редактора

Нужна для модификации интерфейса/логики редактора, например:

• добавить кнопки на тулбар для текста
• добавить кастомный редактор/инспектор для компонента

Пакеты

Пакеты находятся в папке packages.

У пакета должно быть уникальное имя.

Входной точкой пакета являются файлы index.js и style.css.

Пакеты доступны с префиксом edik/.

Т.е. полное имя пакета должно быть следующим:

import { X } from 'edik/some-component';

Пример пакета SomeComponent:

import { CBaseComponent, gcomponent } from '@itgenio/edik-core';

@gcomponent({ name: 'CSome', displayName: 'Some' })
export class SomeComponent extends CBaseComponent {
  onStart() {
    super.onStart();
  }
}

Пример файла someLogic.js:

import type { IPlayer } from '@itgenio/edik-core';

const player: IPlayer = PlayerContext; // <- from global scope

player.on('slideOpened', slide => {
  slide.addObject(SlideObject.empty());
});

Executor

Файлы, папки и спец. папки

В сборке участвуют следующие типы ресурсов:

• код;
• стили(upcoming).

Эти ресурсы могут быть расположены на любом уровне вложенности.

Существуют специальные папки, которые меняют правила сборки:

• editor - файлы внутри доступны только для сборки редактор

Как создается сборка

• Выбрать тип сборки;
• Составить список ресурсов и пакетов, необходимых для типа сборки;
• Конвертируем имена в относительные пути, например:

| packages/some-component/index.js  -> './packages/some-component/index.js'
| folder
|   utils.js                        -> './folder/utils.js'
| main.js                           -> './main.js'

• Генерируем файл entrypoint.js(невидимый), в котором импортируем все файлы. Порядок не имеет значения, так как далее будет строиться дерево зависимостей и код скомпилируется в нужном порядке.

import './packages/some-component/index.js';
import './folder/utils.js';
import './main.js';

• Список файлов с содержимым и entrypoint.js передаются в ESBuild чтобы собрались файлы исполнения (executable files). Эти файлы далее будут запущены на выполнение с помощью Executor-ов.
• Типы импортов:

• относительный: файлы в ресурсах
• наши пакеты: берем из ресурсов. если пакет не установлен - кидаем ошибку
• npm пакеты:
• url до файла?