alexmacarthur / typeit

The most versatile JavaScript typewriter effect library on the planet.
https://typeitjs.com
GNU General Public License v3.0
3.08k stars 200 forks source link

Uncaught (in promise) TypeError: Cannot destructure property 'frames' of 'animation' as it is undefined. #390

Closed EITSxiaozhai closed 2 months ago

EITSxiaozhai commented 2 months ago

I'm coding with vue3+typeit, but when I remove node_modules and install typeit again, I get an error and this effect doesn't show up anymore. I don't know what it is.

import TypeIt from 'typeit'

const VerseGetting = async () => {
  try {
    const response = await fetch('https://v1.jinrishici.com/rensheng/shiguang');
    const data = await response.json();
    return data.content
  } catch (error) {
    console.error('Error fetching data:', error);
  }
};

const text = ref();

onMounted(async () => {
  fetchUvPvData();
  const content = await VerseGetting();
  new (TypeIt)(text.value, {
    strings: [content],
    cursorChar: "<span class='cursorChar'>|<span>",//用于光标的字符。HTML也可以
    speed: 100,
    lifeLike: true,// 使打字速度不规则
    cursor: true,//在字符串末尾显示闪烁的光标
    breakLines: false,// 控制是将多个字符串打印在彼此之上,还是删除这些字符串并相互替换
    loop: false,//是否循环
  }).go()
})

<h1 style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);" id="text" ref="text" class="msg"></h1>

It is in the F12 console and the full error displayed is the following message

index.es.js:828 Uncaught (in promise) TypeError: Cannot destructure property 'frames' of 'animation' as it is undefined.
    at TypeIt.attachCursor_fn (index.es.js:828:13)
    at TypeIt.go (index.es.js:535:5)
    at IndexPage.vue?t=1726389101925:178:6

Here is my pack.json

  "dependencies": {
    "@unhead/vue": "^1.8.9",
    "@vitejs/plugin-vue": "^4.3.4",
    "animate.css": "^4.1.1",
    "axios": "^1.6.0",
    "core-js": "^3.8.3",
    "element-plus": "^2.4.0",
    "fingerprintjs2": "^2.1.4",
    "grecaptcha": "^1.0.3",
    "jsonwebtoken": "^9.0.2",
    "lodash": "^4.17.21",
    "markdown-it": "^13.0.1",
    "os": "^0.1.2",
    "sass": "^1.70.0",
    "sass-loader": "^14.0.0",
    "typeit": "^8.7.1",
    "undraw-ui": "^1.2.1",
    "vite": "^4.5.0",
    "vue": "^3.2.25",
    "vue-jwt-decode": "^0.1.0",
    "vue-meta": "^3.0.0-alpha.2",
    "vue-recaptcha": "^3.0.0-alpha.2",
    "vue-router": "^4.0.13",
    "vue3-recaptcha2": "^1.8.0",
    "vuex": "^4.0.0",
    "vuex-persistedstate": "^4.1.0",
    "wow.js": "^1.2.2"
  },

The problem it has now is that it can't appear to work.

alexmacarthur commented 2 months ago

Found the issue! I'll get back to you later today with a fix. Thanks for letting me know.

alexmacarthur commented 2 months ago

Fixed - thanks again!

https://github.com/alexmacarthur/typeit/releases/tag/v8.8.5