Сборка внешних модулей

Если есть необходимость использовать TypeScript, JSX, и подключение сторонних библиотек.

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

• SDK предоставляет доступ к встроенной в приложение библиотеке React и библиотеке React-компонентов. Это означает, что преобразование JSX в JS должно быть настроено со ссылкой на фабрику элементов:

  window.Universe.Vendor.React.createElement(Component, {});
  Copy

• Для возможностей реактивности внутри приложения используется библиотека mobx, и "старые" декораторы. Использование устаревших декораторов нужно явно указать при настройке транспайла.

TypeScript

SDK-пакет продукта предоставляет рекомендуемую TS-конфигурацию, её можно подключить в tsconfig.json проекта кастомизации:

{
    "extends": ["@universe-dg/sdk/tsconfig.recommended.json"],
    "include": [
      "@universe-dg/sdk"
    ],
    "files": [
      "custom.ts"
    ]
}
Copy

Доступ ко всем типам SDK доступен так же через SDK-пакет:

import {Universe} from '@universe-dg/sdk';

type DefaultExport = Universe.Platform.UserExit.ExternalModuleDefault;

export default {
    userExits: [],
} satisfies DefaultExport;
Copy

Vite

Для сборки внешних модулей рекомендуется (но не обязательно) использовать Vite, т.к. он позволяет с минимальными настройками получить рабочий бандл в виде ES-модуля. Пример vite.config.js:

import {defineConfig} from "vite";

export default defineConfig({
  build: {
    lib: {
      entry: 'src/custom.ts',
      formats: ['es'],
      fileName: 'custom'
    }
  }
});
Copy