анимированный 3d фон с помощью vanta.js в приложении vue(3)

Мне нужно добавить анимированный 3d фон, используя vanta.js в моем приложении vue, я искал различные варианты в открытых источниках, но не нашел подходящего решения для установки и добавления

это мой код приложения vue

 <template>
      <div id="app">
    <div class="vanta_area" ref="Area">
      <headerPage></headerPage>
      <market></market>
    </div>
  </div>

    </template>
    
    <script>
    import headerPage from "./components/header-page.vue";
    import market from "./components/market-page.vue";
    
    export default {
      name: "App",
      components: {
        market,
        headerPage,
      },
    };
    </script>
    
    <style>
    @import url("https://fonts.googleapis.com/css2?family=Jura:wght@300;400;500;600;700&display=swap");
    
    * {
      margin: 0;
      padding: 0;
      font-family: "Jura", sans-serif;
    }
    #app {
      width: 100%;
      height: 100vh;
      background-color: black;
    }
    .hh {
      margin-top: 30vmin;
    }
    .vanta_area {
      width: 100vw;
      height: 100vh;
      position: fixed;
    }
    </style>