How To Add a Hack New Plugins

There is plenty of documentation on how to add a hack in kibana.plugin using UI exports.

How do you add them with the new plugin structure? I generated the plugin and using 7.7.2.

I assume it goes somewhere in here.

import { i18n } from '@kbn/i18n';
import { AppMountParameters, CoreSetup, CoreStart, Plugin } from '../../../src/core/public';
import {
} from './types';
import { PLUGIN_NAME } from '../common';

export class CustomCssServerPlugin
  implements Plugin<CustomCssServerPluginSetup, CustomCssServerPluginStart> {
  public setup(core: CoreSetup): CustomCssServerPluginSetup {
      id: 'customCssServer',
      title: PLUGIN_NAME,
      async mount(params: AppMountParameters) {
        const { renderApp } = await import('./application');
        const [coreStart, depsStart] = await core.getStartServices();
        return renderApp(coreStart, depsStart as AppPluginStartDependencies, params);

    return {
      getGreeting() {
        return i18n.translate('customCssServer.greetingText', {
          defaultMessage: 'Hello from {name}!',
          values: {
            name: PLUGIN_NAME,

  public start(core: CoreStart): CustomCssServerPluginStart {
    return {};

  public stop() {}

Is just importing a JS in plugin.ts the right answer?

import './hacks'

Hacks are not supported in the Kibana platform.

does this mean, hacks were supported in legacy platform, but are not supported in new Kibana platform

Sounds like they wont "support" them. But if you just add a JS file in plugin.ts you can still do it.

import './hacks'

1 Like

What would you like to make happen?

Hacks introduced global effects which can be very difficult to maintain and reason about which is why such behavior is not directly supported in the Kibana platform.

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.