Kibana Plugin Development Environment Setup (With Hot Reloading) [2025]

Introduction

Assuming you’ve completed the ELK Stack Setup Tutorial, this guide will show you how to replace the Kibana Docker instance with a version of Kibana running on WSL2.

Running Kibana on WSL2 allows for faster reloading, making it easier to see changes while developing a plugin.

The key challenge is configuring Kibana on WSL2 to ensure it can still access Elasticsearch and the Fleet Server.

Step 1: Kibana Repository Setup

First, we need to set up the WSL2 by installing a node version manager, node, and yarn.

Then we need to change our versions of node and yarn to match the versions used by the Kibana GitHub Repository.

To do so, run the following commands:

# Install NVM (see https://github.com/nvm-sh/nvm)
$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash


# Add NVM to path
$ export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm


# Install node and yarn
$ nvm install 18.18.2
$ nvm use 18.18.2
$ npm install -g yarn


# Use 1.22.19 or later as 2.0 and later are unsupported
$ yarn set version 1.22.19


# Clone the Kibana repository
$ git clone https://github.com/alexbadia1/kibana/tree/v8.12.2 kibana
$ cd kibana
$ git checkout v8.12.2
$ git switch -c CS598

Step 2: Create Kibana.dev.yaml in Kibana Repo

In the Kibana repository you cloned, create a new file at config/kibana.dev.yml with the following contents:

# Kibana settings from https://github.com/peasead/elastic-container.git
xpack.encryptedSavedObjects.encryptionKey: "thirty-two-or-more-random-characters"
server.host: "localhost"
telemetry.enabled: "true"
xpack.fleet.packages:
  - name: fleet_server
    version: latest
  - name: system
    version: latest
xpack.fleet.agentPolicies:
  - name: Fleet-Server-Policy
    id: fleet-server-policy
    namespace: default
    package_policies:
      - name: fleet_server-1
        package:
          name: fleet_server

Step 4: Kibana SSL Configuration

(1) Exec into the ecp-kibana docker container

$ sudo docker exec -it ecp-kibana sh

(2) Then, manually copy the contents of the following SSL credential files:

$ cat /usr/share/kibana/config/certs/kibana/kibana.crt
$ cat /usr/share/kibana/config/certs/kibana/kibana.key

(3) Finally, manually paste the copied content from the SSL credential files into the kibana repository you cloned at config/certs/kibana.crt and config/certs/kibana.key

Note: You might be able to just generate new SSL credentials…

Step 5: Update Kibana.yaml

(1) In the kibana repository you cloned, replace the contents in config/kibana.yaml with the following content:

server.port: 5601
server.host: "localhost"
server.rewriteBasePath: false
server.name: "ecp-kibana"


server.ssl.enabled: "true"
server.ssl.certificate: config/certs/kibana.crt
server.ssl.key: config/certs/kibana.key


elasticsearch.hosts:
  - "https://localhost:9200"
elasticsearch.username: "kibana_system"
elasticsearch.password: "password"
elasticsearch.ssl.verificationMode: none

(2) Then update the “elasticsearch.password” to match the “KIBANA_PASSWORD” set in the .env file from the elastic-container repository you used to setup the ELK stack.

Step 6: Stop Kibana Container

# If you haven't started the ELK stack yet
$ sudo ./elastic-container.sh start

# Then stop the kibana container
$ sudo docker stop ecp-kibana

Step 6: Run Kibana on WSL2

# 1. Finish the installing dependencies
$ yarn install
$ yarn kbn bootstrap


# 3. Run after the containerized Kibana connection timeouts (port is freed)
$ yarn start

Step 7: Hot Reload

Now that you have Kibana running on the WSL2 instead of the Docker container, you can hot reload Kibana while developing plugins!

Whenever you make a change to the frontend or server plugin, you must rebuild the plugin:

# Build plugin 
$ cd plugins/<plugin-name>
$ yarn dev

Then refresh the chrome tab (sometimes you may need to delete the tabs cookies). For server plugins specifically, you must also restart Kibana:

# 1. Open the terminal wherever you start Kibana
# 2. “Control-C” to kill the kibana process
$ yarn start

Alternatively, you can use fuser (i.e. fuser -k 5601/tcp), kill, etc.

Next Steps: Kibana Plugin Development

Phew! Now that you’ve set up your Kibana development environment, it’s time to start building plugins. But how do I start building plugins?

Stay tuned for my next tutorial to find out here!