How to use the handsontable.plugins function in handsontable

constructor() {
        super();
        this.hotInstance = null;
        this.settingsMapper = new SettingsMapper();
        this.id = null;


        // registerPlugin
        Handsontable.plugins.registerPlugin('dropMenuPlugin', DropMenuPlugin);


    }

createCustomizedContextMenu() {
    return {
      items: {
        row_above: {},
        row_below: {},
        col_left: {},
        col_right: {},
        separator1: Handsontable.plugins.ContextMenu.SEPARATOR,
        remove_row: {},
        remove_col: {},
        separator2: Handsontable.plugins.ContextMenu.SEPARATOR,
        custom_alignment: {
          name: 'Align columns',
          key: 'align_columns',
          submenu: {
            items: [
              {
                name: 'Left',
                key: 'align_columns:1',
                callback: (key, selection) => { this.align('l', selection[0].start.col, selection[0].end.col) },
              }, {
                name: 'Center',
                key: 'align_columns:2',
                callback: (key, selection) => { this.align('c', selection[0].start.col, selection[0].end.col) },
              }, {
                name: 'Right',
                key: 'align_columns:3',

import Handsontable from 'handsontable';
/**
 * @plugin DropMenuPlugin
 *
 */
const MENU_BUTTON_CLASS_NAME = 'DropMenuButton';

class DropMenuPlugin extends Handsontable.plugins.BasePlugin{
    constructor(hotInstance) {
        super(hotInstance);
        this.eventManager = new Handsontable.EventManager(this);
        this.hot.addHook('afterGetColHeader', (col, TH) => this.onAfterGetColHeader(col, TH));
    }

    /**
     * Check if the plugin is enabled in the settings.
     */
    isEnabled() {
        return this.hot.getSettings().dropMenu && !!this.hot.getSettings().dropMenuEnable;
    }
    registerEvents() {
        this.eventManager.addEventListener(this.hot.rootElement, 'click', (event) => this.onToggleMenuClick(event));
    }
    /**

createCustomizedContextMenu() {
    return {
      items: {
        row_above: {},
        row_below: {},
        col_left: {},
        col_right: {},
        separator1: Handsontable.plugins.ContextMenu.SEPARATOR,
        remove_row: {},
        remove_col: {},
        separator2: Handsontable.plugins.ContextMenu.SEPARATOR,
        custom_alignment: {
          name: 'Align columns',
          key: 'align_columns',
          submenu: {
            items: [
              {
                name: 'Left',
                key: 'align_columns:1',
                callback: (key, selection) => { this.align('l', selection[0].start.col, selection[0].end.col) },
              }, {
                name: 'Center',
                key: 'align_columns:2',
                callback: (key, selection) => { this.align('c', selection[0].start.col, selection[0].end.col) },