# Using external javascript library

**URL:** <https://discuss.kotlinlang.org/t/using-external-javascript-library/8417>\
**Category:** JavaScript\
**Created:** [July 4, 2018, 6:41pm UTC](https://discuss.kotlinlang.org/t/using-external-javascript-library/8417 "2018-07-04T18:41:05Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![ricardomef](https://avatars.discourse-cdn.com/v4/letter/r/f9ae1b/32.png) [@ricardomef](https://discuss.kotlinlang.org/u/ricardomef)\
**Post date:** [July 4, 2018, 6:41pm UTC](https://discuss.kotlinlang.org/t/using-external-javascript-library/8417/1 "2018-07-04T18:41:05Z")

</div>

Hello. I’m trying to use the chart.js library in my kotlin project but can’t get it to work.

I downloaded the index.d.ts from https://www.npmjs.com/package/@types/chart.js  
and used ts2kt to generate kotlin definitions. I then included this file in my project and the dependency in the build.gradle (i’m using the kotlin frontend plugin)

```
kotlinFrontEnd {
    npm {
          ...
          dependency("@types/chart.js", "2.7.25")
          ...
    }
}

```

However, when i load my webpage, i get the following error in the console:

```
"Uncaught ReferenceError: Chart is not defined"

```

I tried to fix this by adding the line (and variations like “Chart”, “@types/chart.js”):

```
@file:JsModule("chart.js")

```

to the ts2kt generated file, but then my build fails with the message:

```
"Module not found: Error: Can't resolve 'chart.js' in '/home/myproject/build/js'"

```

How can i fix this?

---

<div class="post-metadata">

**Author:** ![arocnies](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.kotlinlang.org/arocnies/32/5143_2.png) [@arocnies](https://discuss.kotlinlang.org/u/arocnies)\
**Post date:** [July 5, 2018, 3:20am UTC](https://discuss.kotlinlang.org/t/using-external-javascript-library/8417/2 "2018-07-05T03:20:55Z")

</div>

I’m not sure what solution is but I’m interested to see a good example of someone using Chart.js with Kotlin.

---

<div class="post-metadata">

**Author:** ![Konstantin-Khvan](https://avatars.discourse-cdn.com/v4/letter/k/4af34b/32.png) [@Konstantin-Khvan](https://discuss.kotlinlang.org/u/Konstantin-Khvan)\
**Post date:** [July 5, 2018, 9:34am UTC](https://discuss.kotlinlang.org/t/using-external-javascript-library/8417/3 "2018-07-05T09:34:19Z")

</div>

Looks like you have not declared actual chart.js only typescript type definitions.  
Try adding dependency(“chart.js”)

---

<div class="post-metadata">

**Author:** ![ricardomef](https://avatars.discourse-cdn.com/v4/letter/r/f9ae1b/32.png) [@ricardomef](https://discuss.kotlinlang.org/u/ricardomef)\
**Post date:** [July 5, 2018, 5:11pm UTC](https://discuss.kotlinlang.org/t/using-external-javascript-library/8417/4 "2018-07-05T17:11:04Z")

</div>

Thank you @Konstantin-Khvan, it worked! (the JsModule annotation was also needed)