Как ссылаться на класс и метод из библиотеки javascript, включенной в index.html

Question

У меня есть SPA, построенный в React. Мне нужно включить библиотеку JavaScript для аналитики из CDN - она ​​не должна быть связана с остальными библиотеками JS.

До сих пор я узнал, что это не работа webpack и что мне следует использовать загрузчик скриптов, такой как scriptjs. Я нашел эту ветку, но не могу понять реализацию: https://github.com/webpack/webpack/issues/240.

Мне необходимо:

1. включить библиотеку JS из CDN. До сих пор я делал это, ссылаясь на страницу Index.html. (т.е. <script src="//path/to/cdn/utag.js"></script>)

2. ссылаться на библиотеку из компонентов в приложении React. Есть класс utag с методами view() а также link() что мне нужно позвонить, когда кнопки нажимаются в приложении. Если я попробую utag.link() из метода в компоненте реагирования, объект utag не будет определен, и реакция не будет компилироваться.

Как я могу включить эту библиотеку, чтобы она была доступна всем моим компонентам и как я могу ссылаться на класс и методы, которые мне нужны?

Спасибо!

Answer 1

Ссылка на скрипт в HTML в порядке.

Для аналитики вы можете захотеть встроить в свое приложение оболочку, которая обрабатывает события и проверяет доступность нижестоящих функций по следующим направлениям:

var analytics = {
  view: function(a,b,c){
    if(window.utag && window.utag.view && typeof window.utag.view == "function"){
      window.utag.view(a,b,c);
    } else {
      // handle lack of Tealium availability here
    }
  },
  link: function(a,b,c){
    if(window.utag && window.utag.link && typeof window.utag.link == "function"){
      window.utag.link(a,b,c);
    } else {
      // handle lack of Tealium availability here
    }
  }
};

Затем вы можете сразу использовать analytics.view() и analytics.link() и написать код для обработки Tealium, который не был загружен (например, задержка в одну секунду, за которой следует попытка последующего наблюдения).