nwunder / grafana-plugin-template-webpack

Template project for developing plugins for Grafana with Webpack

Webpack Template for Grafana plugins development

Grafana plugin webpack version

Features

• Uses npm instead of bower
• Avoid using /external folder with libs’ sources (but you can, if you want)
• Smaller resulting bundle compared to Grunt build
• All webpack features available
• SASS support with separate styles for dark and light Grafana themes

Build plugin

npm install
npm run build

Styles

There are template SASS files at src/css/ directory. Change ID of root div to ID of your plugin in template.html and SASS files in order to prevent CSS conflicts between plugins.

If you don't need separate styles for for dark and light themes - follow comments in module.js.

If you want to use CSS instead of SASS - just change files extensions at src/css/ directory and in module.js.

See also

• TypeScript extension
• Progress List plugin - full plugin with assets, libs, etc based on this temlpate