grafanagrafana-plugin
How to show custom Grafana plugin in Grafana dashboard correctly?
I am trying to create a Grafana plugin by @grafana/create-plugin.
Based on the readme, first, I generated a plugin by
➜ npx @grafana/create-plugin
? What is going to be the name of your plugin? my-panel-plugin
? What is the organization name of your plugin? hongbomiao
? How would you describe your plugin?
? What kind of plugin would you like? panel
? Do you want to add Github CI and Release workflows? No
? Do you want to add a Github workflow for automatically checking "Grafana API compatibility" on PRs? No
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/.eslintrc
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/.prettierrc.js
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/Dockerfile
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/jest-setup.js
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/jest.config.js
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/mocks/react-inlinesvg.tsx
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/README.md
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/tsconfig.json
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/types/custom.d.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/webpack/constants.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/webpack/utils.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.config/webpack/webpack.config.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.eslintrc
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.nvmrc
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.prettierrc.js
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/CHANGELOG.md
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/cypress/integration/01-smoke.spec.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/docker-compose.yaml
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/.gitignore
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/jest-setup.js
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/jest.config.js
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/LICENSE
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/package.json
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/img/logo.svg
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/README.md
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/tsconfig.json
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/README.md
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/components/SimplePanel.tsx
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/module.test.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/module.ts
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/plugin.json
✔ ++ /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/src/types.ts
✔ +- /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/README.md
✔ +- /Users/hongbo-miao/Clouds/Git/new-grafana-plugins/hongbomiao-mypanelplugin-panel/README.md
Then I ran yarn install with
➜ yarn dev
yarn run v1.22.19
$ webpack -w -c ./.config/webpack/webpack.config.ts --env development
<e> [LiveReloadPlugin] Live Reload disabled: listen EADDRINUSE: address already in use :::35729
assets by path *.md 183 bytes
asset README.md 131 bytes [emitted] [from: README.md] [copied]
asset CHANGELOG.md 52 bytes [emitted] [from: ../CHANGELOG.md] [copied]
asset module.js 159 KiB [emitted] (name: module)
asset LICENSE 11.1 KiB [emitted] [from: ../LICENSE] [copied]
asset img/logo.svg 1.55 KiB [emitted] [from: img/logo.svg] [copied]
asset plugin.json 891 bytes [emitted] [from: plugin.json] [copied]
runtime modules 1.25 KiB 6 modules
modules by path ../node_modules/lodash/*.js 32 KiB
../node_modules/lodash/defaults.js 1.71 KiB [built] [code generated]
../node_modules/lodash/_baseRest.js 559 bytes [built] [code generated]
../node_modules/lodash/eq.js 799 bytes [built] [code generated]
+ 42 modules
modules by path ./ 10.5 KiB
modules by path ./*.ts 2.92 KiB 3 modules
modules by path ./components/*.tsx 7.63 KiB
./components/ConfigEditor.tsx 4.38 KiB [built] [code generated]
./components/QueryEditor.tsx 3.25 KiB [built] [code generated]
modules by path external "@grafana/ 84 bytes
external "@grafana/data" 42 bytes [built] [code generated]
external "@grafana/ui" 42 bytes [built] [code generated]
external "react" 42 bytes [built] [code generated]
webpack 5.74.0 compiled successfully in 396 ms
Type-checking in progress...
assets by status 173 KiB [cached] 6 assets
cached modules 42.7 KiB (javascript) 1.25 KiB (runtime) [cached] 59 modules
webpack 5.74.0 compiled successfully in 196 ms
Type-checking in progress...
No errors found.
After that, I opened a new terminal and ran yarn server:
➜ yarn server
yarn run v1.22.19
$ docker-compose up --build
[+] Building 1.3s (7/7) FINISHED
=> [internal] load build definition from Dockerfile 0.0s
=> => transferring dockerfile: 755B 0.0s
=> [internal] load .dockerignore 0.0s
=> => transferring context: 2B 0.0s
=> [internal] load metadata for docker.io/grafana/grafana:9.1.2 1.2s
=> [auth] grafana/grafana:pull token for registry-1.docker.io 0.0s
=> [1/2] FROM docker.io/grafana/grafana:9.1.2@sha256:980ff2697655a0aa5718e40bbda6ac52299d2f3b1584d0081152e2d0a4742078 0.0s
=> CACHED [2/2] RUN sed -i 's/<\/body><\/html>/<script src=\"http:\/\/localhost:35729\/livereload.js\"><\/script><\/body><\/html>/g' /usr/share/grafana/public/views/index.html 0.0s
=> exporting to image 0.0s
=> => exporting layers 0.0s
=> => writing image sha256:f776788e5baad34844582c7991d67ac7b5a4c6ff83b6496af5f0f0815aa58198 0.0s
=> => naming to docker.io/library/hongbomiao-mypanelplugin-panel-grafana 0.0s
Use 'docker scan' to run Snyk tests against images to find vulnerabilities and learn how to fix them
[+] Running 1/0
⠿ Container hongbomiao-mypanelplugin-panel Created 0.0s
Attaching to hongbomiao-mypanelplugin-panel
hongbomiao-mypanelplugin-panel | Grafana server is running with elevated privileges. This is not recommended
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789836804Z level=info msg="Starting Grafana" version=9.1.2 commit=3c13120cde branch=HEAD compiled=2022-08-30T11:31:21Z
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789958054Z level=info msg="Config loaded from" file=/usr/share/grafana/conf/defaults.ini
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789978013Z level=info msg="Config loaded from" file=/etc/grafana/grafana.ini
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789981054Z level=info msg="Config overridden from command line" arg="default.paths.data=/var/lib/grafana"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789984429Z level=info msg="Config overridden from command line" arg="default.paths.logs=/var/log/grafana"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789986554Z level=info msg="Config overridden from command line" arg="default.paths.plugins=/var/lib/grafana/plugins"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789988804Z level=info msg="Config overridden from command line" arg="default.paths.provisioning=/etc/grafana/provisioning"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789991013Z level=info msg="Config overridden from command line" arg="default.log.mode=console"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789993304Z level=info msg="Config overridden from Environment variable" var="GF_DEFAULT_APP_MODE=development"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789995596Z level=info msg="Config overridden from Environment variable" var="GF_PATHS_DATA=/var/lib/grafana"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789997679Z level=info msg="Config overridden from Environment variable" var="GF_PATHS_LOGS=/var/log/grafana"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.789999763Z level=info msg="Config overridden from Environment variable" var="GF_PATHS_PLUGINS=/var/lib/grafana/plugins"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790001888Z level=info msg="Config overridden from Environment variable" var="GF_PATHS_PROVISIONING=/etc/grafana/provisioning"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790004013Z level=info msg="Config overridden from Environment variable" var="GF_AUTH_ANONYMOUS_ENABLED=true"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790006263Z level=info msg="Config overridden from Environment variable" var="GF_AUTH_ANONYMOUS_ORG_ROLE=Admin"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790008429Z level=info msg="Config overridden from Environment variable" var="GF_AUTH_BASIC_ENABLED=false"
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790010638Z level=info msg="Path Home" path=/usr/share/grafana
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790012888Z level=info msg="Path Data" path=/var/lib/grafana
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790015179Z level=info msg="Path Logs" path=/var/log/grafana
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790017388Z level=info msg="Path Plugins" path=/var/lib/grafana/plugins
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790020388Z level=info msg="Path Provisioning" path=/etc/grafana/provisioning
hongbomiao-mypanelplugin-panel | logger=settings t=2022-11-02T21:40:41.790022888Z level=info msg="App mode development"
hongbomiao-mypanelplugin-panel | logger=sqlstore t=2022-11-02T21:40:41.790065388Z level=info msg="Connecting to DB" dbtype=sqlite3
hongbomiao-mypanelplugin-panel | logger=migrator t=2022-11-02T21:40:41.800350013Z level=info msg="Starting DB migrations"
hongbomiao-mypanelplugin-panel | logger=migrator t=2022-11-02T21:40:41.803593388Z level=info msg="migrations completed" performed=0 skipped=443 duration=262.625µs
hongbomiao-mypanelplugin-panel | logger=plugin.manager t=2022-11-02T21:40:41.824215679Z level=info msg="Plugin registered" pluginId=input
hongbomiao-mypanelplugin-panel | logger=plugin.signature.validator t=2022-11-02T21:40:41.844108513Z level=warn msg="Permitting unsigned plugin. This is not recommended" pluginID=hongbomiao-mypanelplugin-panel pluginDir=/var/lib/grafana/plugins/hongbomiao-mypanelplugin-panel
hongbomiao-mypanelplugin-panel | logger=plugin.manager t=2022-11-02T21:40:41.844162429Z level=info msg="Plugin registered" pluginId=hongbomiao-mypanelplugin-panel
hongbomiao-mypanelplugin-panel | logger=secrets t=2022-11-02T21:40:41.844371721Z level=info msg="Envelope encryption state" enabled=true currentprovider=secretKey.v1
hongbomiao-mypanelplugin-panel | logger=query_data t=2022-11-02T21:40:41.845634221Z level=info msg="Query Service initialization"
hongbomiao-mypanelplugin-panel | logger=live.push_http t=2022-11-02T21:40:41.848155138Z level=info msg="Live Push Gateway initialization"
hongbomiao-mypanelplugin-panel | logger=ticker t=2022-11-02T21:40:41.857981054Z level=info msg=starting first_tick=2022-11-02T21:40:50Z
hongbomiao-mypanelplugin-panel | logger=infra.usagestats.collector t=2022-11-02T21:40:41.892286679Z level=info msg="registering usage stat providers" usageStatsProvidersLen=2
hongbomiao-mypanelplugin-panel | logger=provisioning.datasources t=2022-11-02T21:40:41.897490221Z level=error msg="can't read datasource provisioning files from directory" path=/etc/grafana/provisioning/datasources error="open /etc/grafana/provisioning/datasources: no such file or directory"
hongbomiao-mypanelplugin-panel | logger=provisioning.plugins t=2022-11-02T21:40:41.898617513Z level=error msg="Failed to read plugin provisioning files from directory" path=/etc/grafana/provisioning/plugins error="open /etc/grafana/provisioning/plugins: no such file or directory"
hongbomiao-mypanelplugin-panel | logger=provisioning.notifiers t=2022-11-02T21:40:41.900185554Z level=error msg="Can't read alert notification provisioning files from directory" path=/etc/grafana/provisioning/notifiers error="open /etc/grafana/provisioning/notifiers: no such file or directory"
hongbomiao-mypanelplugin-panel | logger=provisioning.alerting t=2022-11-02T21:40:41.901483513Z level=error msg="can't read alerting provisioning files from directory" path=/etc/grafana/provisioning/alerting error="open /etc/grafana/provisioning/alerting: no such file or directory"
hongbomiao-mypanelplugin-panel | logger=provisioning.alerting t=2022-11-02T21:40:41.901517929Z level=info msg="starting to provision alerting"
hongbomiao-mypanelplugin-panel | logger=provisioning.alerting t=2022-11-02T21:40:41.901523679Z level=info msg="finished to provision alerting"
hongbomiao-mypanelplugin-panel | logger=grafanaStorageLogger t=2022-11-02T21:40:41.902017471Z level=info msg="storage starting"
hongbomiao-mypanelplugin-panel | logger=ngalert t=2022-11-02T21:40:41.903549763Z level=info msg="warming cache for startup"
hongbomiao-mypanelplugin-panel | logger=http.server t=2022-11-02T21:40:41.904667888Z level=info msg="HTTP Server Listen" address=[::]:3000 protocol=http subUrl= socket=
hongbomiao-mypanelplugin-panel | logger=provisioning.dashboard t=2022-11-02T21:40:41.904551679Z level=error msg="can't read dashboard provisioning files from directory" path=/etc/grafana/provisioning/dashboards error="open /etc/grafana/provisioning/dashboards: no such file or directory"
hongbomiao-mypanelplugin-panel | logger=ngalert.multiorg.alertmanager t=2022-11-02T21:40:41.912154596Z level=info msg="starting MultiOrg Alertmanager"
hongbomiao-mypanelplugin-panel | logger=context traceID=00000000000000000000000000000000 userId=0 orgId=1 uname= t=2022-11-02T21:40:50.505230044Z level=info msg="Request Completed" method=GET path=/api/live/ws status=0 remote_addr=172.23.0.1 time_ms=3 duration=3.0385ms size=0 referer= traceID=00000000000000000000000000000000
hongbomiao-mypanelplugin-panel | logger=live t=2022-11-02T21:40:50.528537336Z level=info msg="Initialized channel handler" channel=grafana/dashboard/uid/u7hG9eN4z address=grafana/dashboard/uid/u7hG9eN4z
hongbomiao-mypanelplugin-panel | logger=live.features t=2022-11-02T21:40:50.528954711Z level=error msg="Error getting dashboard" query="{Slug: Id:0 Uid:u7hG9eN4z OrgId:1 Result:<nil>}" error="Dashboard not found"
The Grafana dashboard at http://localhost:3000/dashboards is empty:
Based on the docker log, the provisioning folder is empty, which seems the issue. But then I found https://github.com/grafana/plugin-tools/issues/56 saying provisioning is designed to be not generated any more now.
How to show custom Grafana plugin in the Dashboard correctly?
Solution
I just found because the new version of the @grafana/create-plugin does not generate the provisioning folder any more, which means I have to add by meself.
However, the docker log is kind of misleading as it still expects the provisioning folder.
(The docker-compose.yml file got generated by the template. You can remove this line corresponding to generated docker-compose.yml, then it won't throw any error.)
For "panel" plugin, here are the steps below. Similar to "data source" and "app" plugins, I need add manually at their own places.
- In Grafana How To Create and Fill a 2D matrix
- How to calculate the average value in a Prometheus query from Grafana
- Securing grafana ingress with tls in kube-prometheus-stack values.yaml and make grafana available via https
- How to filter out some values of grafana dashboard variable?
- Grafana OSS OnCall can't connect to Grafana-Cloud
- Is there a way in prometheus to count how many records exists using promQl?
- PromQL Condition within query
- How can I use regex for filtering CloudWatch metrics with Grafana?
- Limit Restart Attempts in Self-Healing Process for Application on EC2
- How to meter an external counter in Micrometer?
- Dynamic number of series with one query in Grafana
- Monitoring log files using some metrics exporter + Prometheus + Grafana
- How do I use cumulative data to show an hourly total?
- How do I write an "or" logical operator on Prometheus or Grafana
- Tracking events with prometheus and grafana
- Error: Unable to connect with Loki. Please check the server logs for more details on Grafana
- Starting Grafana-server always gives me bind: address already in use even though I change port
- How to hide a column based on a variable in Grafana
- Grafana: Dropdown Variable is not selecting the particular values in Dashboard and Viz
- How to show IP of domain name in grafana?
- PromQL if/else-like expression based on value of Grafana query variable
- Aggregate promql histogram for requests duration across all paths for a multi-node service
- my "lon" coordinate doesn't show up in a Geomap of Grafana
- How do I configure grafana to use Oauth2 when it's behind an Application Load Balancer?
- Why is it not all azure app-insights metric appear in Grafana
- How to list prometheus alerts in a dashboard in grafana?
- promQL or metricsQL subtract two time series
- How to query RedisTimeSeries data on Grafana
- PromQL query for specific duration
- How do I write a Prometheus query that returns the value of a label?