@itgenio/edik-compiler v0.0.18

@itgenio/edik-compiler

Браузерный компилятор, собирающий CJS модули для работы с install

Для сборки JS используется esbuild-wasm.

Для сборки CSS используется less.

Файлы кода

На выходе получается файл с названием [name].[hash].js, например:

type CompilerFile = { name: string; content: string };

const someFiles: CompilerFile[] = [
  {
    name: 'index.js',
    content: `
    import { logger } from './utils/logger.js';
    console.log(logger());
  `,
  },

  {
    name: 'utils/logger.js',
    content: `
    export const logger = () => 'logs';
  `,
  },
];

const moduleFile: CompilerFile = {
  name: 'index.KLIO2BFQ.js',
  content: `edikInstall({'node_modules':{'index.KLIO2BFQ.js'(require,exports,module) {
  const logger = () => 'logs';
  console.log(logger());
}}},{extensions:['.js','.css','.less','.ts','.json']})`,
};

Файлы стилей

На выходе получается файл с названием style.css

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

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

• код;
• стили.

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

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

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

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

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

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

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

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

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

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