kibana/docs/development/core/public/kibana-plugin-public.appmountparameters.appbasepath.md

Home > kibana-plugin-public > AppMountParameters > appBasePath

AppMountParameters.appBasePath property

The base path for configuring the application's router.

Signature:

appBasePath: string;

Example

How to configure react-router with a base path:

// inside your plugin's setup function
export class MyPlugin implements Plugin {
  setup({ application }) {
    application.register({
    id: 'my-app',
    async mount(context, params) {
      const { renderApp } = await import('./application');
      return renderApp(context, params);
    },
  });
}

// application.tsx
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom';

export renderApp = (context, { appBasePath, element }) => {
  ReactDOM.render(
    // pass `appBasePath` to `basename`
    <BrowserRouter basename={appBasePath}>
      <Route path="/" exact component={HomePage} />
    </BrowserRouter>,
    element
  );

  return () => ReactDOM.unmountComponentAtNode(element);
}