Work with frontend components
Develop the frontend component of a Grafana plugin in Typescript with ReactJS as the View library. Several commands are available within the plugin
directory for interacting with the frontend.
We do not support plugins written in Angular.
Frontend CLI reference
You can run the following commands when developing your plugin:
npm run dev
Builds the plugin in development mode and watches for changes to source code to rebuild the plugin.
npm run build
Builds the plugin for production. The output can be found in the ./dist
directory.
npm run test
Launches the test runner in watch mode.
npm run e2e
Launches the e2e test runner. Make sure to have an instance of Grafana running before you run e2e tests.
npm run lint
Runs the linter against source code to verify that you have adhered to the formatting and styling rules. This command will also report warnings for usage of deprecated code.
npm run lint:fix
Runs the linter in fix mode to automatically format the frontend code.