# Transpiler of external libraries in grafana plugin

**URL:** <https://community.grafana.com/t/transpiler-of-external-libraries-in-grafana-plugin/20327>\
**Category:** Grafana Plugin Development\
**Created:** [August 20, 2019, 4:33pm UTC](https://community.grafana.com/t/transpiler-of-external-libraries-in-grafana-plugin/20327 "2019-08-20T16:33:11Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![gpjacquet](https://avatars.discourse-cdn.com/v4/letter/g/b487fb/32.png) [@gpjacquet](https://community.grafana.com/u/gpjacquet)\
**Post date:** [August 20, 2019, 4:33pm UTC](https://community.grafana.com/t/transpiler-of-external-libraries-in-grafana-plugin/20327/1 "2019-08-20T16:33:11Z")

</div>

Hello,  
I am a beginner in reactJs and I am currently developing a plugin for grafana. I tested a lot of things that worked very well. The only problem now is that I would like to use Material but I feel that it does not detect it. An idea?

```
import React, { PureComponent } from 'react';
import { PanelProps, PanelPlugin } from '@grafana/ui';
import MaterialTable from 'material-table';
/* import Datas from './components/datas'; */

export class MyPanel extends PureComponent<PanelProps> {
/* state = {
    datas: [],
  }; */

  constructor(props: any) {
    super(props);
  }

/* componentDidMount() {
    fetch('http://jsonplaceholder.typicode.com/todos')
      .then(res => res.json())
      .then(data => {
        this.setState({ datas: data });
      })
      .catch(console.log);
  } */

  render() {
    return (
      <MaterialTable
        title="Editable Example"
        columns={[
          { title: "Adı", field: "name" },
          { title: "Soyadı", field: "surname" },
          { title: "Doğum Yılı", field: "birthYear", type: "numeric" }
        ]}
        data={[{ name: 'Mehmet', surname: 'Baran', birthYear: 1987 }]}
      />
    );
  }

  /* render() {
    return (
      <Datas datas={this.state.datas} />
    )

  } */
}

export const plugin = new PanelPlugin(MyPanel);

```

I tried to position the module in the dist / external part. I can see that the module has been detected and accessible (http: // localhost: 3000 / public / plugins / issue-simple-panel / external / material-table / dist / index.js). The problem is that Material-table has other dependencies. So how to do that? Does Grafana offer a solution for external dependencies?