#Plugin

Em NocoBase, o Plugin Cliente é a principal forma de estender e personalizar a funcionalidade do frontend. Ao estender a classe base Plugin fornecida por @nocobase/client, os desenvolvedores podem registrar lógica, adicionar componentes de página, estender menus ou integrar funcionalidades de terceiros em diferentes estágios do ciclo de vida.

#Estrutura da Classe Plugin

A estrutura básica de um plugin do lado do cliente é a seguinte:

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

export class PluginHelloClient extends Plugin {
  async afterAdd() {
    // Executado após o plugin ser adicionado
    console.log('Plugin added');
  }

  async beforeLoad() {
    // Executado antes do plugin carregar
    console.log('Before plugin load');
  }

  async load() {
    // Executado quando o plugin carrega, registra rotas, componentes de UI, etc.
    console.log('Plugin loaded');
  }
}

export default PluginHelloClient;

#Descrição do Ciclo de Vida

Cada plugin passa sequencialmente pelos seguintes estágios do ciclo de vida quando o navegador é atualizado ou a aplicação é inicializada:

#Ordem de Execução

Toda vez que o navegador é atualizado, afterAdd() → beforeLoad() → load() serão executados.

#Contexto do Plugin e FlowEngine

A partir do NocoBase 2.0, as APIs de extensão do lado do cliente estão principalmente concentradas no FlowEngine. Na classe do plugin, você pode obter a instância do engine através de this.engine.

// Acesse o contexto do engine no método load()
async load() {
  const { app, router, apiClient } = this.engine.context;
  console.log('Current app:', app);
}

Para mais detalhes, consulte:

• FlowEngine
• Contexto