Skip to content

Latest commit

 

History

66 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

@thinking-home/ui

Базовая библиотека для разработки плагинов ThinkingHome System.

  • общие интерфейсы и API для хоста и плагинов;
  • сборка плагинов в самодостаточные ESM-бандлы (Vite), которые хост загружает через import(url).

Сборка плагина

Разработчику плагина не нужно добавлять Vite или конфиги — всё внутри @thinking-home/ui. Достаточно раннера th-build.

npm init -y
npm install @thinking-home/ui

Опиши точки входа — любым из двух способов:

A. По соглашению (без конфига): каждый файл в src/entries/ — это точка входа, имя бандла совпадает с именем файла.

src/entries/widget.tsx      ->  dist/widget.js
src/entries/settings.tsx    ->  dist/settings.js

B. Явно, в package.json (полный контроль над именами и путями):

{
  "thPlugin": {
    "entries": {
      "widget": "src/widget.tsx",
      "settings": "src/panels/settings.tsx"
    }
  }
}

Каждая точка входа экспортирует экземпляр плагина как default:

import React from "react";
import { createModule } from "@thinking-home/ui";

function Widget() {
  return <div>hello</div>;
}

export default createModule(Widget);

Собери:

{
  "scripts": {
    "build": "th-build"
  }
}
npm run build          # -> dist/widget.js, dist/settings.js (по одному на точку входа)
npm run build -- --mode development   # dev-сборка с sourcemap

В dist/ появится по одному самодостаточному ESM-бандлу на каждую точку входа — их можно грузить через import(url).

Общие библиотеки

Библиотеки из shared.json в бандл плагина не попадают: они остаются bare-импортами, а хост подставляет их через import map из общих вендорных бандлов. Плагин может импортировать их напрямую, ничего не устанавливая в свою сборку:

  • react, react-dom;
  • react-router, react-router-dom, history;
  • @mantine/core, @mantine/hooks;
  • @thinking-home/ui, @thinking-home/i18n;
  • @thinking-home/stm, @thinking-home/stm-react — стейт-менеджер (thinking-home/stm). Библиотека загружается один раз на весь интерфейс, поэтому хост и все плагины работают с одним экземпляром stm.

Экспорт хелперов

Если нужен собственный vite.config, базовый конфиг доступен отдельно:

import { createPluginConfig, resolveEntries } from "@thinking-home/ui/build";

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Used by

Contributors

Languages