How to use external angular modules in own plugin

Grafana Plugin Development
1

Hello. I’m developing my datasource plugin based on simple-json. I want to use the library angular-ivh-treeview, but I do not understand how to use it in the plugin. I have already revised the entire forum, found several topics, understood that I need to keep the library files in the src folder and then import it into the project. But after grunt build nothing happens. Please, help me.

1 Like
2

So, the situation has cleared up a bit. I imported the library. Now I have another question, how to add the library module to Grafana?

1 Like
3

What do you mean add it to grafana?

1 Like
4

I want to use threeview in the datasource plugin. You can tell by the steps that I need for this.

1 Like
5

I am having the same issue, I believe. I want to be able to install some node modules into my plugin’s directory then reference them as I would say the lodash module or the d3 module. I have looked around a bit and found that it is a systemjs error and we need to update the mapping in the systemjs.config file, but I can not find a systemjs.config file anywhere.

1 Like
6

system.config is located in the puplic/app folder of the source Grafana. I also looked at the public\app\features\plugins\plugin_loader.ts file in which there is method exposeToPlugin(name: string, component: any), I think maybe this is what we need?

1 Like
7

Yea I found it a little while ago, but making changes does not do anything. I wonder if the program has to be rebuilt.

1 Like
8

I think that it is necessary because Grafana loads what is in the folder public\build. You need run command “grunt release” in root folder of Grafana source (where located Gruntfile.js)

1 Like
9

So I found a system.config item that resides in boot.js and when you update it, it does work in the program. This allows you to drop node modules into the vendor folder and use them appropriately.

1 Like
10

But this approach loses modularity. I think there should be some kind of API through which we can add own angular modules.

1 Like
11

Agreed, this is very hackish.

1 Like
12

Has anything cleared up?

1 Like
13

Can someone help me? How to include this module lib (https://github.com/iVantage/angular-ivh-treeview) into panel plugin?

1 Like
14

I am having the same issue. I want to import socket.io js library in my datasource plugin but systemJs cannot find it. I cannot even find the systemjs.config file. When I made changes in plugin loader and added some code in exportToPlugins method, my entire Grafana stopped working and started giving errors when I would run grunt watch.