Как импортировать эту старую библиотеку под названием TagCanvas?

Question

Я пытаюсь использовать старую библиотеку с React / Typescript, чтобы создать облако слов сферы, как видно здесь .

Это то, что я сделал до сих пор.

1. Создайте путь node_modules / tagcanvas / dist / tagcanvas. js с этим файлом .

2. Следуйте инструкциям по установке Инструкции .

3. С помощью следующего кода мы вводим блок catch и myCanvasContainer element.style. .display становится none, что означает, что TagCanvas.Start не удалось создать экземпляр в блоке try.

4. Когда я регистрирую TagCanvas, это пустой объект.

Я пробовал разные способы импорта TagCanvas. ех. импорт * как TagCanvas

import * as React from 'react';
import TagCanvas from 'tagcanvas/dist/tagcanvas';

const Test: React.FC = () => {
  console.log('tagCanvas', TagCanvas)
  React.useEffect(() => {
    try {
      TagCanvas.Start('myCanvas');
    } catch(e) {
      // something went wrong, hide the canvas container
      document.getElementById('myCanvasContainer').style.display = 'none';
    }
  });

  return (
    <div>
      <div id="myCanvasContainer">
        <canvas width="300" height="300" id="myCanvas">
          <p>Anything in here will be replaced on browsers that support the canvas element</p>
          <ul>
            <li><a href="http://www.google.com" target="_blank">Google</a></li>
            <li><a href="/fish">Fish</a></li>
            <li><a href="/chips">Chips</a></li>
            <li><a href="/salt">Salt</a></li>
            <li><a href="/vinegar">Vinegar</a></li>
          </ul>
        </canvas>
      </div>
    </div>
  );
};