# How to require external libraries in a component helper file?

**URL:** <https://meta.discourse.org/t/how-to-require-external-libraries-in-a-component-helper-file/195392>\
**Category:** Development\
**Created:** [June 29, 2021, 6:25pm UTC](https://meta.discourse.org/t/how-to-require-external-libraries-in-a-component-helper-file/195392 "2021-06-29T18:25:33Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![Nacho\_Caballero](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nacho_caballero/32/130189_2.png) [@Nacho\_Caballero](https://meta.discourse.org/u/Nacho_Caballero)\
**Post date:** [June 29, 2021, 6:25pm UTC](https://meta.discourse.org/t/how-to-require-external-libraries-in-a-component-helper-file/195392/1 "2021-06-29T18:25:33Z")

</div>

I’m writing a theme component and I need to access two external libraries from a helper file. My current approach works, but it feels a bit clunky:

In my initializer:

```js
import { apiInitializer } from 'discourse/lib/api';
import loadScript from 'discourse/lib/load-script';
import myHelper from '../lib/helper';

export default apiInitializer('0.11.1', (api) => {
  api.decorateCookedElement(
    (elem) => {
      loadScript(D3_URL).then(() => {
        loadScript(LUXON_URL).then(() => {
          ...
          myHelper(whatever, d3, luxon)
          ...
        })
      })
    },
    {id: 'discourse-xyz', onlyStream: true}
  )
});

```

Then in `myHelper.js`:

```plaintext
export default function myHelper(whatever, d3, luxon) {
  d3();
  luxon();
  ...
}

```

I tried requiring the libraries from the helper file directly, but that means I’d have to return a promise and then do `myHelper(whatever, d3, luxon).then(...)` in the initializer, which I’d rather not do for other reasons.

Is there a better approach?

---

_[View the full topic](https://meta.discourse.org/t/how-to-require-external-libraries-in-a-component-helper-file/195392)._