#Плагін

У NocoBase Клієнтський плагін є основним способом розширення та налаштування функціональності фронтенду. Наслідуючи базовий клас Plugin, що надається @nocobase/client, розробники можуть реєструвати логіку, додавати компоненти сторінок, розширювати меню або інтегрувати сторонні функції на різних етапах життєвого циклу.

#Структура класу плагіна

Ось як виглядає найпростіша структура клієнтського плагіна:

import { Plugin } from '@nocobase/client';

export class PluginHelloClient extends Plugin {
  async afterAdd() {
    // Виконується після додавання плагіна
    console.log('Plugin added');
  }

  async beforeLoad() {
    // Виконується перед завантаженням плагіна
    console.log('Before plugin load');
  }

  async load() {
    // Виконується під час завантаження плагіна, реєструє маршрути, компоненти інтерфейсу тощо.
    console.log('Plugin loaded');
  }
}

export default PluginHelloClient;

#Опис життєвого циклу

Кожен плагін послідовно проходить наступні етапи життєвого циклу під час оновлення браузера або ініціалізації застосунку:

#Порядок виконання

Щоразу при оновленні браузера виконується послідовність afterAdd() → beforeLoad() → load()

#Контекст плагіна та FlowEngine

Починаючи з NocoBase 2.0, API розширення на стороні клієнта зосереджені переважно у FlowEngine. У класі плагіна ви можете отримати екземпляр рушія через this.engine.

// Доступ до контексту рушія в методі load()
async load() {
  const { app, router, apiClient } = this.engine.context;
  console.log('Current app:', app);
}

Докладніше дивіться тут:

• FlowEngine
• Контекст